/* Diario: главная журнала и статья. */

/* ── шапка журнала ─────────────────────────────────────────────────── */
.dia-cab{padding-block:30px 10px}
.dia-cab__rejilla{display:grid;gap:18px;margin-top:24px}
.dia-cab__titulo{font-size:clamp(58px,15vw,176px);line-height:.86;letter-spacing:-.04em}
.dia-cab__titulo em{display:block;font-style:italic;font-size:.5em;letter-spacing:-.02em;padding-left:.12em;color:var(--terracota)}
.dia-temas{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px;padding-top:16px;border-top:1px solid var(--tinta)}
@media (min-width:900px){
  .dia-cab{padding-block:46px 10px}
  .dia-cab__rejilla{grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end;margin-top:34px}
  .dia-cab__titulo{grid-column:1 / 9}
  .dia-cab__entrada{grid-column:9 / 13;padding-bottom:14px}
  .dia-temas{margin-top:40px}
}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--linea);background:var(--blanco);font-size:15px;font-weight:500;
  transition:border-color .2s,background-color .2s,color .2s}
.chip:hover{border-color:var(--tinta)}
.chip[aria-pressed="true"]{background:var(--tinta);border-color:var(--tinta);color:var(--papel)}

/* ── главный материал ──────────────────────────────────────────────── */
.dia-destacado{display:grid;gap:24px;padding-block:34px 60px}
.dia-destacado__foto{display:block;overflow:hidden}
.dia-destacado__foto img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1.2s var(--ease)}
.dia-destacado__foto:hover img{transform:scale(1.035)}
.dia-destacado__texto{display:grid;gap:18px;align-content:center}
.dia-destacado__kicker{color:var(--terracota)}
.dia-destacado__titulo{font-size:clamp(44px,6.4vw,92px);line-height:.95;letter-spacing:-.03em}
.dia-destacado__titulo em{font-style:italic}
.dia-destacado__titulo a{transition:color .25s}
.dia-destacado__titulo a:hover{color:var(--terracota)}
@media (min-width:900px){
  .dia-destacado{grid-template-columns:repeat(12,1fr);column-gap:24px;padding-block:60px 110px}
  .dia-destacado__foto{grid-column:1 / 7}
  .dia-destacado__foto img{aspect-ratio:5/6}
  .dia-destacado__texto{grid-column:7 / 13;position:relative;z-index:1}
  /* заголовок заходит на фото на бумажной плашке, остальной текст — рядом */
  .dia-destacado__titulo{justify-self:start;margin-left:-130px;padding:20px 10px 12px 26px;background:var(--papel)}
}

/* ── заметки: разные по устройству карточки ───────────────────────── */
.dia-notas{padding-block:10px 80px;border-top:1px solid var(--tinta)}
.dia-notas__rejilla{display:grid;gap:34px;padding-top:30px}
.nota-d{display:grid;gap:12px;align-content:start}
.nota-d[hidden]{display:none}
.nota-d__tema{color:var(--terracota)}
.nota-d__t{font-size:clamp(28px,3vw,38px);line-height:1.05}
.nota-d__txt{font-size:16px;line-height:1.6;color:var(--tinta-80);max-width:32em}
.nota-d__foto{overflow:hidden}
.nota-d__foto img{width:100%;aspect-ratio:3/2;object-fit:cover}
.nota-d--alta .nota-d__foto img{aspect-ratio:4/5}
.nota-d--foto .nota-d__foto img{aspect-ratio:1;object-position:55% 50%}
.nota-d--cifra{padding:24px 22px;background:var(--papel-2)}
.nota-d__cifra{font-family:var(--serif);font-style:italic;font-weight:300;font-size:120px;line-height:.8;color:var(--terracota)}
.nota-d__cifra span{font-size:28px;font-style:normal;color:var(--tinta)}
.nota-d--cita{padding:26px 22px;background:var(--tinta);color:var(--papel)}
.nota-d--cita .nota-d__tema{color:#e6ab9c}
.nota-d--cita .nota-d__txt{color:rgba(248,245,239,.8)}
.nota-d--cita :focus-visible{outline-color:var(--papel)}
.nota-d__frase{font-family:var(--serif);font-style:italic;font-size:clamp(30px,3.4vw,44px);line-height:1.1}
.nota-d--texto{padding-top:18px;border-top:4px double var(--tinta)}
.dia-vacio{padding:40px 0;font-family:var(--serif);font-style:italic;font-size:26px;color:var(--tinta-60)}
@media (min-width:900px){
  .dia-notas{padding-bottom:120px}
  /* вёрстка номера: у каждой заметки своё место; при выбранной теме — ровная сетка */
  .dia-notas__rejilla{grid-template-columns:repeat(12,1fr);column-gap:24px;row-gap:56px;padding-top:48px}
  .nota-d--cifra{grid-column:1 / 5;grid-row:1;align-self:start}
  .nota-d--ancha{grid-column:5 / 13;grid-row:1 / 3}
  .nota-d--cita{grid-column:1 / 5;grid-row:2;align-self:end;padding:34px 30px}
  .nota-d--texto{grid-column:1 / 6;grid-row:3;align-self:center}
  .nota-d--alta{grid-column:7 / 13;grid-row:3;grid-template-columns:1fr 1fr;column-gap:24px;align-items:end}
  .nota-d--alta .nota-d__foto{grid-row:1 / 6}
  .nota-d--foto{grid-column:2 / 13;grid-row:4;grid-template-columns:4fr 7fr;column-gap:40px;align-items:center}
  .nota-d--foto .nota-d__foto{grid-row:1 / 6;grid-column:2}
  .nota-d--foto>:not(.nota-d__foto){grid-column:1}
  .nota-d--foto .nota-d__foto img{aspect-ratio:16/10}
  .dia-notas__rejilla.filtrado>.nota-d{grid-column:span 6;grid-row:auto;align-self:start}
}

/* ── календарь сезона ──────────────────────────────────────────────── */
.calendario{padding-block:64px 72px;background:var(--papel-2)}
.calendario__cab{display:grid;gap:18px;margin-block:26px 30px}
.calendario__ahora{display:grid;gap:6px}
.calendario__ahora .rotulo{color:var(--tinta-60)}
.calendario__flores{font-family:var(--serif);font-style:italic;font-size:30px;line-height:1.15}
.calendario__flores::first-letter{text-transform:uppercase}
.tabla-flor{overflow-x:auto;margin-inline:calc(-1*var(--lado));padding-inline:var(--lado)}
.calendario__tabla{width:100%;min-width:320px;border-collapse:separate;border-spacing:0 6px;table-layout:fixed}
.calendario__tabla thead th:first-child{width:34%}
.calendario__tabla th[scope="row"]{padding-right:10px;text-align:left;font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calendario__tabla thead th{padding-bottom:6px;font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--tinta-60);text-align:center}
.calendario__tabla td{height:26px;padding:0;background:rgba(28,38,32,.05);border-left:2px solid var(--papel-2)}
.calendario__tabla td.si{background:var(--salvia)}
.calendario__tabla tr:nth-child(3n+2) td.si{background:var(--terracota)}
.calendario__tabla tr:nth-child(3n) td.si{background:#b8894a}
.calendario__tabla .mes-actual{box-shadow:inset 0 0 0 2px var(--tinta)}
.calendario__tabla thead th.mes-actual{box-shadow:none;color:var(--tinta);background:none}
.calendario__tabla thead th.mes-actual::after{content:"";display:block;width:6px;height:6px;margin:4px auto 0;border-radius:50%;background:var(--terracota)}
.calendario__nota{margin-top:18px;max-width:40em}
@media (min-width:900px){
  .calendario{padding-block:96px 110px}
  .calendario__cab{grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:end;margin-block:34px 44px}
  .calendario__cab .titulo{grid-column:1 / 8}
  .calendario__ahora{grid-column:8 / 13;padding-bottom:10px}
  .calendario__tabla thead th:first-child{width:18%}
  .calendario__tabla th[scope="row"]{font-size:22px}
  .calendario__tabla td{height:32px}
  .calendario__tabla thead th{font-size:13px}
}

/* ── глоссарий ─────────────────────────────────────────────────────── */
.glosario__titulo{margin-block:26px 30px;max-width:13ch}
.glosario__lista{display:grid;gap:0;border-top:1px solid var(--tinta)}
.glosario__lista div{padding-block:18px;border-bottom:1px solid var(--linea)}
.glosario__lista dt{font-family:var(--serif);font-style:italic;font-size:30px;line-height:1.1}
.glosario__lista dd{margin-top:6px;font-size:15.5px;line-height:1.55;color:var(--tinta-80)}
@media (min-width:760px){
  .glosario__lista{grid-template-columns:1fr 1fr;column-gap:36px}
}
@media (min-width:900px){
  .glosario__titulo{margin-block:34px 50px}
  .glosario__lista{grid-template-columns:repeat(3,1fr);column-gap:40px}
  .glosario__lista div{padding-block:24px 26px}
}

/* ════ статья ════════════════════════════════════════════════════════ */
.progreso{position:fixed;left:0;right:0;top:0;z-index:60;height:3px;pointer-events:none}
.progreso span{display:block;height:100%;width:100%;background:var(--terracota);transform-origin:0 50%;transform:scaleX(0)}
html:not(.js) .progreso{display:none}
.art-cab{padding-block:14px 30px}
.art-cab .migas{padding-top:0}
.migas ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:14px;color:var(--tinta-60)}
.migas li+li::before{content:"/";margin-right:10px;color:var(--linea)}
.migas a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;transition:color .2s}
.migas a:hover{color:var(--tinta)}
.migas [aria-current]{color:var(--tinta)}
.art-cab__kicker{margin-top:18px;color:var(--terracota)}
.art-cab__titulo{margin-top:14px;max-width:11ch;font-size:clamp(50px,10.5vw,132px);line-height:.92;letter-spacing:-.035em}
.art-cab__titulo em{font-style:italic}
.art-cab__entrada{margin-top:22px;max-width:30em;font-family:var(--serif);font-size:clamp(22px,2.4vw,28px);line-height:1.35;color:var(--tinta-80)}
.art-cab__meta{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:22px;padding-top:14px;border-top:1px solid var(--linea);
  font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-60)}
.art-foto{margin:0 auto;max-width:calc(var(--max) + 2*var(--lado));padding-inline:var(--lado)}
.art-foto img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 25%}
@media (min-width:900px){
  .art-cab{padding-block:18px 0}
  .art-cab .migas,.art-cab__kicker,.art-cab__titulo,.art-cab__entrada,.art-cab__meta{margin-left:calc((100% - 0px) * 3 / 12)}
  .art-cab .migas{margin-left:0}
  .art-cab__kicker{margin-top:34px}
  .art-cab__entrada,.art-cab__meta{max-width:calc(100% * 5 / 12 - 24px)}
  .art-foto{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;margin-top:-240px;pointer-events:none}
  .art-foto img{grid-column:9 / 13;aspect-ratio:4/5;pointer-events:auto}
  .art-foto .pie-foto{grid-column:9 / 13}
}

.art-cuerpo{display:grid;gap:26px;padding-block:40px 70px}
.art-indice{display:none}
.art-texto{max-width:38em;font-size:18px;line-height:1.7;color:var(--tinta-80)}
.art-intro{font-size:19px}
.gesto{position:relative;display:grid;gap:10px;margin-top:44px;padding-top:22px;border-top:1px solid var(--tinta)}
.gesto__dib{width:72px;height:72px;color:var(--tinta);--relleno:var(--papel)}
.gesto__n{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1;color:var(--terracota)}
.gesto__t{font-size:clamp(30px,3.4vw,42px);line-height:1.05;color:var(--tinta)}
.art-cita{margin:48px 0 8px;padding:24px 0;border-block:1px solid var(--tinta)}
.art-cita p{font-family:var(--serif);font-style:italic;font-size:clamp(32px,4.4vw,52px);line-height:1.08;color:var(--tinta);text-wrap:balance}
.art-cita p::before{content:"«";color:var(--terracota)}
.art-cita p::after{content:"»";color:var(--terracota)}
.art-no{margin-top:44px;padding:22px 22px 24px;background:var(--papel-2);border-left:3px solid var(--terracota)}
.art-no .rotulo{color:var(--terracota);margin-bottom:10px}
.art-no li{position:relative;padding:8px 0 8px 22px;font-size:16px;line-height:1.55}
.art-no li::before{content:"";position:absolute;left:0;top:18px;width:10px;height:1.4px;background:var(--terracota);transform:rotate(45deg)}
.art-no li::after{content:"";position:absolute;left:0;top:18px;width:10px;height:1.4px;background:var(--terracota);transform:rotate(-45deg)}
@media (min-width:900px){
  .art-cuerpo{grid-template-columns:repeat(12,1fr);column-gap:24px;padding-block:70px 110px}
  .art-indice{grid-column:1 / 3;display:block;position:sticky;top:calc(var(--cab) + 30px);align-self:start}
  .art-indice .rotulo{margin-bottom:12px;color:var(--tinta-60)}
  .art-indice ol{display:grid;gap:0;border-top:1px solid var(--linea);counter-reset:g}
  .art-indice li{counter-increment:g}
  .art-indice a{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid var(--linea-fina);font-size:14.5px;line-height:1.3;color:var(--tinta-60);transition:color .2s}
  .art-indice a::before{content:counter(g);font-family:var(--serif);font-style:italic;color:var(--terracota)}
  .art-indice a:hover,.art-indice a.activo{color:var(--tinta)}
  .art-indice a.activo{font-weight:600}
  .art-texto{grid-column:4 / 10}
  .gesto{grid-template-columns:1fr;padding-left:0}
  .gesto__dib{position:absolute;left:calc(-96px - 24px);top:26px;width:96px;height:96px}
  .art-cita{margin-right:-40%}
  .art-no{margin-right:-30%}
}

/* сколько живёт в вазе */
.cuanto{margin-top:56px;padding-top:22px;border-top:4px double var(--tinta)}
.cuanto .rotulo{color:var(--terracota)}
.cuanto__t{margin-top:10px;font-size:clamp(34px,4vw,50px);line-height:1.05;color:var(--tinta)}
.cuanto__t em{font-style:italic}
.cuanto .nota{margin-top:8px}
.barras{display:grid;gap:10px;margin-top:22px}
.barras li{display:grid;grid-template-columns:118px 1fr 48px;align-items:center;gap:10px}
@media (min-width:900px){.barras li{grid-template-columns:150px 1fr 48px}.barras__escala{margin-left:160px}}
.barras__flor{font-family:var(--serif);font-size:19px;line-height:1.1;color:var(--tinta)}
.barras__pista{position:relative;height:12px;background:rgba(28,38,32,.07)}
.barras__pista i{position:absolute;top:0;bottom:0;left:calc(var(--de) / 21 * 100%);width:calc((var(--a) - var(--de)) / 21 * 100%);background:var(--salvia);
  transform-origin:0 50%;transition:transform 1s var(--ease)}
.barras li:nth-child(n+5) .barras__pista i{background:#b8894a}
.barras li:nth-child(n+8) .barras__pista i{background:var(--terracota)}
.barras__pista::before{content:"";position:absolute;top:0;bottom:0;left:0;width:calc(var(--de, 0) / 21 * 100%)}
.animar .barras:not(.visto) .barras__pista i{transform:scaleX(0)}
.barras__dias{font-family:var(--serif);font-size:18px;text-align:right;font-variant-numeric:lining-nums;color:var(--tinta)}
.barras__escala{position:relative;height:22px;margin:8px 58px 0 128px;font-size:12px;color:var(--tinta-60)}
.barras__escala span{position:absolute;left:calc(var(--x) / 21 * 100%);transform:translateX(-50%);white-space:nowrap}
.barras__escala span:last-child{transform:translateX(-100%)}
.art-fin{display:grid;gap:18px;margin-top:56px;padding-top:24px;border-top:1px solid var(--tinta)}
.art-fin__firma{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.4;color:var(--tinta)}
.art-fin__firma .rotulo{display:block;margin-bottom:6px;font-style:normal;color:var(--tinta-60)}
@media (min-width:600px){.art-fin .btn{width:auto}}

/* ещё почитать */
.art-mas{padding-block:0 90px}
.art-mas__rejilla{display:grid;grid-auto-rows:1fr;gap:14px;margin-top:26px}
.art-mas__item{display:grid;gap:8px;padding:22px 20px 24px;border:1px solid var(--linea);background:var(--blanco);transition:border-color .25s,transform .35s var(--ease)}
.art-mas__item:hover{border-color:var(--tinta);transform:translateY(-3px)}
.art-mas__item .rotulo{color:var(--terracota)}
.art-mas__t{font-family:var(--serif);font-size:28px;line-height:1.1}
.art-mas__d{font-size:15px;line-height:1.5;color:var(--tinta-60)}
@media (min-width:900px){
  .art-mas{padding-bottom:130px}
  .art-mas__rejilla{grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
}
