/* The Journal index (4 Sep 2026). Drawn by novamira-sandbox/journal-index.php. */
.soma-jn{--jn-max:1180px;background:var(--soma-base)}
.soma-jn h1,.soma-jn h2{text-wrap:balance}
.soma-jn p{margin:0}
/* hero */
.soma-jn-hero{background:var(--soma-primary);color:var(--soma-white);position:relative;overflow:hidden;padding:clamp(3rem,2rem + 4vw,6rem) var(--soma-gutter) clamp(1.75rem,1rem + 2vw,3rem)}
.soma-jn-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(70% 90% at 15% 20%,rgba(13,124,104,.35) 0%,rgba(13,124,104,0) 60%),radial-gradient(50% 70% at 95% 100%,rgba(204,213,255,.18) 0%,rgba(204,213,255,0) 60%);pointer-events:none}
.soma-jn-hero__in{position:relative;max-width:var(--jn-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,1rem + 5vw,6rem);align-items:end}
.soma-jn-hero .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-jn-hero h1{color:var(--soma-white);font-size:clamp(2.5rem,1.2rem + 4.6vw,4.6rem);letter-spacing:-.01em;margin:18px 0 22px}
.soma-jn-lead{color:var(--soma-white-70);font-size:clamp(1.125rem,1.05rem + .35vw,1.375rem);line-height:1.6;max-width:34em}
.soma-jn-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.soma-jn-facts span{display:flex;flex-direction:column;gap:4px;background:var(--soma-white-12);border-radius:var(--soma-r-md);padding:16px 18px;font-size:.875rem;color:var(--soma-white-70)}
.soma-jn-facts b{font-family:var(--soma-font-display);font-weight:600;font-size:clamp(1.75rem,1.4rem + 1.2vw,2.5rem);line-height:1;color:var(--soma-white);font-variant-numeric:tabular-nums}
.soma-jn-chips{position:relative;max-width:var(--jn-max);margin:clamp(1.5rem,1rem + 2vw,2.5rem) auto 0}
.soma-jn-chips .soma-chips{flex-wrap:wrap}\n@media (max-width:900px){.soma-jn-chips .soma-chips{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;padding-bottom:4px}}
.soma-jn-chips .soma-chips::-webkit-scrollbar{display:none}
.soma-jn .soma-jn-chips .soma-chip{background:var(--soma-white-12);color:var(--soma-white);white-space:nowrap;text-decoration:none}
.soma-jn .soma-jn-chips .soma-chip:hover{background:rgba(255,255,255,.22);color:var(--soma-white)}
.soma-jn .soma-jn-chips .soma-chip--on{background:var(--soma-white);color:var(--soma-primary)}
/* shelf */
.soma-jn-shelf{padding:clamp(2.5rem,1.5rem + 3vw,4.5rem) var(--soma-gutter)}
.soma-jn-shelf__in{max-width:var(--jn-max);margin:0 auto;display:flex;flex-direction:column;gap:clamp(1.5rem,1rem + 2vw,2.5rem)}
:is(.soma-jn,.soma-fh) .soma-jn-card{display:flex;flex-direction:column;background:var(--soma-white);border-radius:var(--soma-r-lg);overflow:hidden;color:var(--soma-primary);text-decoration:none;transition:transform var(--soma-dur-lift) var(--soma-ease),box-shadow var(--soma-dur-lift) var(--soma-ease)}
:is(.soma-jn,.soma-fh) .soma-jn-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px var(--soma-shadow)}
.soma-jn-card__media{display:block;aspect-ratio:16/9;background:var(--soma-primary-deep);overflow:hidden;border-left:5px solid var(--c)}
.soma-jn-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.soma-jn-card__body{display:flex;flex-direction:column;gap:8px;padding:20px 22px 24px}
.soma-jn-card__field{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--c)}
.soma-jn-card__title{font-family:var(--soma-font-display);font-weight:600;font-size:1.5rem;line-height:1.15;text-wrap:balance}
.soma-jn-card__ex{color:var(--soma-text);font-size:.9375rem;line-height:1.55}
.soma-jn-card__meta{color:var(--soma-text);font-size:.8125rem;margin-top:auto;padding-top:6px}
/* the lead: image left, words right */
:is(.soma-jn,.soma-fh) .soma-jn-card--lead{flex-direction:row;align-items:stretch}
.soma-jn-card--lead .soma-jn-card__media{flex:0 0 58%;aspect-ratio:auto;min-height:360px}
.soma-jn-card--lead .soma-jn-card__body{flex:1;padding:clamp(1.5rem,1rem + 2vw,2.75rem);justify-content:center;gap:12px}
.soma-jn-card--lead .soma-jn-card__title{font-size:clamp(1.9rem,1.3rem + 2vw,2.8rem)}
.soma-jn-card--lead .soma-jn-card__ex{font-size:1.0625rem;line-height:1.6}
.soma-jn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,.75rem + 1vw,1.5rem)}
.soma-jn-pages{display:flex;justify-content:center}
/* ending */
.soma-jn-end{background:var(--soma-primary);color:var(--soma-white);padding:clamp(3.5rem,2rem + 5vw,7rem) var(--soma-gutter)}
.soma-jn-end__in{max-width:var(--jn-max);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,1rem + 4vw,5rem);align-items:center}
.soma-jn-end .soma-eyebrow{color:var(--soma-periwinkle)}
.soma-jn-end h2{color:var(--soma-white);font-size:clamp(2rem,1.3rem + 3vw,3.4rem);margin:14px 0 14px}
.soma-jn-end p{color:var(--soma-white-70);max-width:36em;font-size:1.0625rem}
.soma-jn-end__acts{display:flex;flex-direction:column;gap:10px;min-width:280px}
.soma-jn-end__acts .soma-btn{justify-content:center}
.soma-jn a.soma-jn-ghost{background:transparent;color:var(--soma-white);box-shadow:inset 0 0 0 1.5px var(--soma-line-inverse)}
.soma-jn a.soma-jn-ghost:hover{background:var(--soma-white-12)}
@media (max-width:1100px){
  .soma-jn-hero__in{grid-template-columns:1fr;align-items:start}
  .soma-jn-facts{max-width:520px}
  .soma-jn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  :is(.soma-jn,.soma-fh) .soma-jn-card--lead{flex-direction:column}
  .soma-jn-card--lead .soma-jn-card__media{flex:none;aspect-ratio:16/8;min-height:0}
  .soma-jn-end__in{grid-template-columns:1fr}
  .soma-jn-end__acts{flex-direction:row;flex-wrap:wrap}
}
@media (max-width:640px){
  .soma-jn-hero h1{font-size:clamp(2.25rem,8.6vw,2.9rem)}
  .soma-jn-facts{grid-template-columns:1fr 1fr;gap:8px}
  .soma-jn-facts span{padding:12px 14px}
  .soma-jn-grid{grid-template-columns:1fr}
  .soma-jn-card--lead .soma-jn-card__media{aspect-ratio:16/9}
  .soma-jn-end__acts{flex-direction:column}
}


/* soma: green closing band */
/* The band and the footer were the same navy, so the page's last call to action
   dissolved into the footer. Green separates them. */
.soma-jn-end{background:var(--soma-secondary)}
.soma-jn-end .soma-eyebrow{color:rgba(255,255,255,.72)}
.soma-jn-end p{color:rgba(255,255,255,.82)}
.soma-jn-end__acts .soma-btn:not(.soma-jn-ghost){background:var(--soma-white);color:var(--soma-secondary);border-color:var(--soma-white)}
/* templates.css turns every .soma-page link navy on hover, which blacks out
   links on a coloured surface. Hold white here. */
section.soma-jn-end a:hover,section.soma-jn-end a:focus-visible{color:var(--soma-white)}
section.soma-jn-end .soma-jn-end__acts a.soma-btn:not(.soma-jn-ghost):hover,
section.soma-jn-end .soma-jn-end__acts a.soma-btn:not(.soma-jn-ghost):focus-visible{color:var(--soma-secondary)}