@charset "UTF-8";

/* An article-first journal. The shared palette and accessible controls come from style.css. */
.site-header { min-height:98px; }
.site-header nav { gap:24px; }
.site-header .brand { font-size:20px; }
.site-header .header-cta { border-radius:999px; padding-inline:19px; }
.journal-home { overflow:clip; }
.journal-masthead { padding-block:58px 38px; }
.journal-masthead>.eyebrow { font-size:11px; letter-spacing:.2em; }
.journal-masthead h1 { margin:18px 0 22px; font-size:clamp(50px,6.25vw,90px); font-weight:700; line-height:1.25; letter-spacing:-.075em; }
.journal-masthead h1 em { display:inline-block; font-style:normal; color:var(--accent); }
.journal-intro { max-width:720px; color:var(--muted); font-size:16px; line-height:1.95; }
.journal-masthead-meta { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; margin-top:20px; color:var(--muted); font-size:12px; line-height:1.7; }
.journal-masthead-meta>span { display:inline-flex; align-items:center; min-height:30px; padding:3px 11px; border:1px solid var(--line); border-radius:999px; }
.journal-masthead-meta>a { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); text-decoration:underline; text-underline-offset:4px; }
.journal-masthead-meta>button { min-height:44px; padding:7px 13px; border:1px solid var(--line); border-radius:999px; background:var(--white); color:var(--muted); font-size:12px; line-height:1.7; }
.journal-masthead-meta>button:hover { border-color:var(--accent); color:var(--accent); }

/* The index remains visible while the selected article takes the larger stage. */
.journal-feature { display:grid; grid-template-columns:280px minmax(0,1fr); gap:36px; align-items:start; margin-top:16px; margin-bottom:76px; }
.feature-index { min-width:0; padding-top:8px; }
.feature-index>.eyebrow { font-size:11px; letter-spacing:.15em; }
.feature-index>h2 { margin:12px 0 24px; font-size:28px; line-height:1.5; letter-spacing:-.045em; }
.feature-selectors { display:grid; gap:10px; }
.feature-selector { display:grid; grid-template-columns:28px minmax(0,1fr) 18px; gap:10px; align-items:center; width:100%; min-height:94px; padding:16px 14px; border:1px solid var(--line); border-radius:16px; background:var(--white); color:var(--ink); text-align:left; }
.feature-number { align-self:start; padding-top:3px; color:var(--muted); font-family:var(--mono); font-size:12px; line-height:1.6; }
.feature-selector>span:not(.feature-number) { min-width:0; }
.feature-selector strong { display:block; font-size:15px; font-weight:600; line-height:1.65; }
.feature-selector small { display:block; margin-top:5px; color:var(--muted); font-size:12px; line-height:1.6; }
.feature-selector>b { font-size:20px; font-weight:400; }
.feature-selector[aria-pressed="true"] { border-color:var(--ink); background:var(--ink); color:var(--white); }
.feature-selector[aria-pressed="true"] .feature-number,.feature-selector[aria-pressed="true"] small { color:var(--inverse-muted); }
.feature-stage { min-width:0; }
.feature-panel { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:24px; background:var(--white); }
.feature-panel+.feature-panel { margin-top:24px; }
.feature-ready .feature-panel { margin-top:0; }
.feature-ready .feature-panel[hidden] { display:none; }
.feature-art { position:relative; display:block; height:330px; overflow:hidden; background:var(--surface); }
.feature-copy { padding:26px 30px 28px; }
:is(.journal-home,.journal-index) .article-meta { display:flex; flex-wrap:wrap; gap:6px 12px; margin:0; color:var(--muted); font-size:11px; line-height:1.75; letter-spacing:.02em; }
:is(.journal-home,.journal-index) .article-meta>span { display:inline-block; }
.feature-copy>h2 { margin:11px 0 13px; font-size:clamp(25px,2.3vw,32px); line-height:1.55; letter-spacing:-.035em; }
.feature-copy>.summary { max-width:45em; color:var(--muted); font-size:15px; line-height:1.9; }
.feature-read-link { display:inline-flex; align-items:center; gap:16px; min-height:44px; margin-top:15px; color:var(--accent); font-size:14px; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.feature-controls { display:none; justify-content:flex-end; align-items:center; gap:10px; margin-top:16px; }
.feature-ready .feature-controls { display:flex; }
.feature-controls>button { display:inline-flex; justify-content:center; align-items:center; width:44px; height:44px; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--white); font-size:20px; line-height:1; }
.feature-controls>[data-feature-count] { min-width:60px; color:var(--muted); font-family:var(--mono); font-size:12px; text-align:center; }
.feature-controls>button:hover { border-color:var(--accent); background:var(--accent-soft); color:var(--accent); }

/* These article visuals explain a topic; they are not product-photo substitutes. */
.editorial-art { position:relative; isolation:isolate; display:flex; flex-direction:column; justify-content:space-between; gap:12px; width:100%; height:100%; min-width:0; padding:26px 28px; overflow:hidden; background:var(--surface); color:var(--ink); }
.editorial-art .art-kicker { position:relative; z-index:1; flex-shrink:0; font-family:var(--mono); font-size:11px; line-height:1.6; letter-spacing:.12em; }
.editorial-art .art-display { position:relative; z-index:1; display:flex; flex:1; align-items:center; justify-content:center; min-width:0; min-height:0; }
.editorial-art .art-caption { position:relative; z-index:1; inset:auto; display:block; flex-shrink:0; color:var(--muted); font-family:var(--sans); font-size:12px; line-height:1.7; letter-spacing:0; }
.editorial-art .art-orbit { position:absolute; z-index:0; top:50%; left:50%; width:260px; height:260px; border:1px solid var(--line); border-radius:50%; transform:translate(-50%,-50%); pointer-events:none; }
.editorial-art .art-orbit::before { position:absolute; inset:32px; content:''; border:1px solid var(--line); border-radius:50%; }
.editorial-art .art-orbit::after { position:absolute; top:26px; right:30px; width:10px; height:10px; content:''; border-radius:50%; background:var(--accent); }
.art-bag { background:var(--surface); }
.art-bag-pair { position:relative; z-index:1; display:grid; flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; gap:28px; width:min(100%,620px); min-height:0; margin-inline:auto; }
.art-bag-pair figure { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; min-height:0; height:100%; margin:0; }
.art-bag-pair img { display:block; width:100%; height:calc(100% - 28px); max-height:205px; min-height:0; object-fit:contain; }
.art-bag-pair figcaption { flex-shrink:0; margin-top:8px; color:var(--ink); font-family:var(--mono); font-size:12px; line-height:1.65; text-align:center; }
.art-bag-single .art-bag-pair { grid-template-columns:1fr; width:min(70%,320px); }
.art-bag>.art-caption { padding-right:105px; }
.art-source { position:absolute; right:20px; bottom:20px; color:var(--muted); font-size:10px; line-height:1.7; }
.art-power { background:var(--accent-soft); }
.power-split { position:relative; z-index:1; display:flex; flex:1; align-items:center; justify-content:center; gap:24px; width:100%; min-height:0; }
.power-split strong { position:relative; display:block; font-family:var(--sans); font-size:clamp(70px,8.5vw,125px); font-weight:600; line-height:1.1; letter-spacing:-.075em; white-space:nowrap; }
.power-split>strong:last-child { color:var(--accent); }
.power-split strong>span { margin-left:4px; font-size:.38em; letter-spacing:-.035em; }
.power-split strong>small { display:block; margin-top:9px; color:var(--muted); font-family:var(--mono); font-size:12px; font-weight:400; line-height:1.6; letter-spacing:.08em; text-align:center; }
.power-split>b { align-self:center; margin-top:-20px; color:var(--muted); font-size:28px; font-weight:400; line-height:1; }
.art-code { background:var(--ink); color:var(--white); }
.art-code .art-kicker,.art-code .art-caption { color:var(--inverse-muted); }
.art-code .art-orbit,.art-code .art-orbit::before { border-color:rgba(255,255,255,.16); }
.art-code .art-orbit::after { background:var(--inverse-accent); }
.code-pair { position:relative; z-index:1; display:flex; flex:1; align-items:center; justify-content:center; gap:18px; max-width:100%; min-height:0; transform:rotate(-5deg); }
.code-pair>span { padding:20px 26px; border:1px solid rgba(255,255,255,.28); border-radius:16px; font-family:var(--mono); font-size:clamp(36px,4.8vw,66px); font-weight:600; line-height:1.2; letter-spacing:-.05em; }
.code-pair>span:first-child { border-color:var(--accent-soft); background:var(--accent-soft); color:var(--ink); }
.art-sql .code-pair,.art-python .code-pair { flex-direction:column; gap:13px; transform:rotate(-3deg); }
.code-pair>small { color:var(--inverse-muted); font-family:var(--mono); font-size:13px; line-height:1.8; letter-spacing:.02em; }
.connection-lines { position:relative; z-index:1; display:grid; flex:1; align-self:center; align-content:center; gap:6px; width:min(80%,460px); min-height:0; }
.connection-lines>span { display:flex; align-items:center; justify-content:space-between; gap:16px; min-width:0; padding:13px 26px; border:1px solid var(--line); border-radius:999px; background:var(--white); font-size:25px; font-weight:500; line-height:1.5; letter-spacing:-.035em; }
.connection-lines>i { color:var(--muted); font-family:var(--mono); font-size:12px; font-style:normal; line-height:1.3; text-align:center; }
.connection-lines>span::before { content:''; width:12px; height:12px; flex-shrink:0; border:2px solid var(--accent); border-radius:50%; }
.connection-lines>span::after { content:'→'; margin-left:auto; color:var(--accent); font-size:26px; }

.journal-articles { padding-top:8px; }
.journal-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:24px; margin-bottom:27px; }
.journal-section-head h2 { margin-top:10px; font-size:clamp(28px,3.2vw,40px); font-weight:600; letter-spacing:-.05em; }
.journal-section-head .eyebrow { color:var(--muted); font-size:11px; letter-spacing:.15em; }
.journal-section-head>span { color:var(--muted); font-size:13px; }
.article-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-bottom:17px; border-bottom:1px solid var(--line); }
.article-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.article-tabs>button { min-height:44px; padding:9px 17px; border:1px solid transparent; border-radius:999px; background:var(--surface); color:var(--ink); font-size:14px; line-height:1.7; }
.article-tabs>button:hover { background:var(--accent-soft); color:var(--accent); }
.article-tabs>button[aria-pressed="true"] { background:var(--accent); color:var(--white); }
.article-tabs>button[aria-pressed="true"]:hover { background:var(--accent-hover); }
.article-tabs>button>span { margin-left:6px; font-family:var(--mono); font-size:11px; }
.article-search { display:flex; align-items:center; gap:10px; width:300px; max-width:100%; min-width:0; padding:2px 16px; border:1px solid var(--line); border-radius:999px; background:var(--white); }
.article-search>span { flex-shrink:0; font-size:14px; color:var(--muted); }
.article-search:focus-within { border-color:var(--accent); }
.article-search input { width:100%; min-width:0; min-height:44px; padding:8px 0; border:0; background:transparent; color:var(--ink); font-size:14px; line-height:1.7; }
.article-search input::placeholder { color:var(--muted); opacity:1; }
#article-result-count { margin:17px 0 25px; color:var(--muted); font-size:12px; line-height:1.8; }
.journal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; gap:26px 24px; }
.journal-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:22px; background:var(--white); }
.card-art { display:block; position:relative; height:240px; flex-shrink:0; overflow:hidden; background:var(--surface); }
.card-art .editorial-art { gap:8px; padding:20px; }
.card-art .art-kicker { font-size:10px; letter-spacing:.09em; }
.card-art .art-caption { font-size:11px; }
.card-art .art-orbit { width:190px; height:190px; }
.card-art .art-bag-pair { gap:12px; }
.card-art .art-bag-pair img { max-height:140px; }
.card-art .art-bag-pair figcaption { margin-top:6px; font-size:11px; }
.card-art .power-split { gap:14px; }
.card-art .power-split strong { font-size:70px; }
.card-art .power-split>b { font-size:21px; }
.card-art .power-split strong>small { font-size:11px; }
.card-art .code-pair { gap:10px; }
.card-art .code-pair>span { padding:14px 13px; border-radius:12px; font-size:31px; }
.card-art .connection-lines { gap:4px; width:100%; }
.card-art .connection-lines>span { gap:10px; padding:10px 16px; font-size:19px; }
.card-art .connection-lines>span::before { width:10px; height:10px; }
.card-art .connection-lines>span::after { font-size:21px; }
.journal-card-copy { display:flex; flex:1; flex-direction:column; min-width:0; padding:23px 24px 22px; }
.journal-card-copy>h3 { margin:10px 0 13px; font-size:22px; font-weight:600; line-height:1.6; letter-spacing:-.035em; }
.journal-card-copy>.summary { margin-bottom:16px; color:var(--muted); font-size:14px; line-height:1.9; }
.card-read { display:inline-flex; align-items:center; gap:12px; align-self:flex-start; min-height:44px; margin-top:auto; color:var(--accent); font-size:13px; font-weight:600; }
.journal-paths { margin-top:66px; padding-top:42px; border-top:1px solid var(--line); }
.journal-path-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.journal-path { display:flex; flex-direction:column; min-width:0; padding:26px; border:1px solid var(--line); border-radius:20px; background:var(--white); }
.journal-path>span { display:inline-flex; align-items:center; justify-content:center; align-self:flex-start; min-width:32px; min-height:32px; padding:4px 11px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-family:var(--mono); font-size:11px; }
.journal-path>h2 { margin:19px 0 12px; font-size:25px; font-weight:600; line-height:1.6; letter-spacing:-.04em; }
.journal-path>p { margin-bottom:20px; color:var(--muted); font-size:14px; line-height:1.9; }
.journal-path>b { margin-top:auto; font-size:24px; font-weight:400; line-height:1.5; }
.journal-latest { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:0; margin-bottom:64px; padding-top:28px; border-top:1px solid var(--line); }
.journal-latest>p { color:var(--muted); font-size:15px; line-height:1.9; }
.journal-latest>.text-link { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); font-size:13px; text-decoration:underline; text-underline-offset:5px; }
.journal-latest h2 { font-size:28px; }
.journal-latest ul { margin:20px 0 0; padding:0; list-style:none; }
.journal-latest li { display:grid; grid-template-columns:110px minmax(0,1fr); align-items:baseline; gap:20px; padding:14px 0; border-bottom:1px solid var(--line); }
.journal-latest time { color:var(--muted); font-family:var(--mono); font-size:12px; }
.journal-latest li>a { display:inline-flex; align-items:center; min-height:44px; font-size:15px; line-height:1.8; }
.journal-tools-teaser { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-block:42px 32px; padding:28px 32px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }
.journal-tools-teaser .eyebrow { margin-bottom:10px; font-size:10px; }
.journal-tools-teaser h2 { margin-bottom:9px; font-size:25px; font-weight:600; }
.journal-tools-teaser p { max-width:55em; color:var(--muted); font-size:14px; line-height:1.9; }
.journal-tools-teaser>a { display:inline-flex; align-items:center; flex-shrink:0; gap:14px; min-height:44px; color:var(--accent); font-size:14px; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.journal-tools-teaser>a.button { border-radius:999px; color:var(--white); text-decoration:none; }

/* The article index and comparison shelf share the journal's editorial rhythm. */
.journal-index>.section-wrap:first-child { padding-top:24px; }
.journal-index-intro { padding-block:12px 45px; }
.journal-index-intro h1 { margin:16px 0 22px; font-size:clamp(40px,5vw,68px); line-height:1.35; letter-spacing:-.065em; }
.journal-index-intro>p:last-child { color:var(--muted); font-size:16px; line-height:1.95; }
.journal-index-footer { padding-block:36px 64px; }
.journal-index-footer .text-link,.catalogue-intro>.text-link { display:inline-flex; align-items:center; min-height:44px; color:var(--accent); text-decoration:underline; text-underline-offset:5px; }
.catalogue-intro { padding-block:46px 20px; }
.catalogue-intro h1 { margin:16px 0 22px; font-size:clamp(36px,4vw,58px); line-height:1.45; }
.catalogue-intro>p:not(.eyebrow) { color:var(--muted); font-size:16px; line-height:1.9; }
.catalogue-intro>.text-link { margin-top:12px; }
.catalogue-page .tools-section { padding-top:36px; padding-bottom:64px; }

/* A comfortable measure for full articles, independent of the gallery's width. */
.article-page { max-width:900px; }
.journal-card-copy>h3,.feature-copy>h2 { text-wrap:balance; }
.article-title-detail { display:block; margin-top:14px; color:var(--muted); font-size:.57em; font-weight:500; line-height:1.7; letter-spacing:0; }
.article-page>.article-intro { max-width:760px; }
.article-page .detail-body { max-width:760px; }
.article-page .detail-body>section>p { font-size:17px; line-height:2; }
.article-page .detail-body>section>.review-note { font-size:13px; line-height:1.9; }
.article-page .detail-body>section.sources>p { font-size:14px; line-height:1.9; }
.article-page .detail-body h2 { line-height:1.6; }
.reading-progress { position:fixed; z-index:45; top:0; left:0; width:100%; height:2px; background:var(--accent); transform:scaleX(var(--reading-progress,0)); transform-origin:left center; pointer-events:none; }

/* Content is visible by default; JavaScript opts individual blocks into a brief reveal. */
.motion-ready [data-reveal] { transition:opacity .45s ease,transform .45s ease; }
.motion-ready [data-reveal].reveal-pending { opacity:0; transform:translateY(18px); }
.motion-ready [data-reveal].is-visible { opacity:1; transform:translateY(0); }
.feature-panel.is-entering { animation:journal-enter .32s ease both; }
.feature-ready .feature-art .art-bag-pair img { animation:journal-float 7s ease-in-out infinite; }
.feature-ready .feature-art .art-bag-pair figure:nth-child(2) img { animation-delay:-3.5s; }
.feature-ready .feature-art .art-orbit { animation:journal-orbit 18s ease-in-out infinite; }
@keyframes journal-enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes journal-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@keyframes journal-orbit { 0%,100% { transform:translate(-50%,-50%) rotate(0deg); } 50% { transform:translate(-50%,-50%) rotate(18deg); } }

@media (hover:hover) and (pointer:fine) {
  .journal-card,.journal-path { transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
  .journal-card:hover,.journal-path:hover { transform:translateY(-4px); border-color:var(--accent); box-shadow:0 12px 30px var(--shadow); }
  .motion-ready .journal-card.is-visible:hover { transform:translateY(-4px); }
  .feature-selector:hover { border-color:var(--accent); }
  .feature-selector[aria-pressed="false"]:hover { background:var(--accent-soft); }
}

@media (min-width:980px) {
  .journal-masthead { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.8fr); grid-template-areas:"label label" "title intro" "title meta"; column-gap:54px; padding-block:42px 32px; }
  .journal-masthead>.eyebrow { grid-area:label; }
  .journal-masthead h1 { grid-area:title; margin:17px 0 0; font-size:clamp(56px,5.8vw,80px); }
  .journal-intro { grid-area:intro; align-self:end; padding-top:24px; }
  .journal-masthead-meta { grid-area:meta; align-self:start; margin-top:13px; gap:7px 12px; }
}

@media (max-width:1120px) {
  .journal-masthead { padding-block:46px 30px; }
  .journal-masthead h1 { font-size:clamp(48px,6.1vw,70px); }
  .journal-feature { grid-template-columns:250px minmax(0,1fr); gap:26px; }
  .feature-selector { grid-template-columns:24px minmax(0,1fr) 16px; gap:8px; padding:15px 12px; }
  .feature-selector strong { font-size:14px; }
  .feature-art { height:310px; }
  .feature-copy { padding:24px; }
  .feature-copy>h2 { font-size:27px; }
  .power-split { gap:24px; }
  .power-split strong { font-size:86px; }
  .power-split>b { font-size:24px; }
  .code-pair { gap:14px; }
  .code-pair>span { padding:18px 20px; font-size:44px; }
  .connection-lines { width:90%; }
  .connection-lines>span { font-size:23px; }
  .journal-grid { gap:22px 20px; }
  .card-art { height:220px; }
  .card-art .editorial-art { padding:17px; }
  .card-art .power-split strong { font-size:59px; }
  .card-art .code-pair>span { padding:12px 10px; font-size:27px; }
  .card-art .connection-lines>span { padding:10px 12px; font-size:17px; }
  .journal-card-copy { padding:21px 20px; }
  .journal-card-copy>h3 { font-size:20px; }
  .journal-path { padding:24px; }
  .journal-path>h2 { font-size:23px; }
}
@media (max-width:900px) {
  .journal-feature { grid-template-columns:1fr; gap:24px; margin-bottom:60px; }
  .feature-index { padding-top:0; }
  .feature-index>h2 { margin:10px 0 20px; font-size:29px; }
  .feature-selectors { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .feature-selector { min-height:82px; padding:14px; }
  .feature-selector strong { font-size:15px; }
  .feature-art { height:330px; }
  .feature-copy>h2 { font-size:29px; }
  .power-split strong { font-size:105px; }
  .code-pair>span { font-size:56px; }
  .journal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  .card-art { height:240px; }
  .card-art .editorial-art { padding:20px; }
  .card-art .power-split strong { font-size:70px; }
  .card-art .code-pair>span { font-size:30px; }
  .card-art .connection-lines>span { padding-inline:15px; font-size:19px; }
  .journal-card-copy>h3 { font-size:21px; }
  .article-tabs>button { padding-inline:14px; }
  .article-search { width:265px; }
  .journal-path-grid { gap:14px; }
  .journal-path { padding:22px; }
  .journal-path>h2 { font-size:22px; }
  .journal-tools-teaser { gap:24px; padding:26px; }
}
@media (max-width:680px) {
  .site-header { min-height:84px; }
  .site-header .brand { font-size:18px; }
  .site-header .header-cta { padding:9px 13px; }
  .journal-masthead { padding-block:32px 26px; }
  .journal-masthead>.eyebrow { font-size:10px; letter-spacing:.15em; }
  .journal-masthead h1 { margin:16px 0 20px; font-size:clamp(42px,11.5vw,66px); line-height:1.27; letter-spacing:-.07em; }
  .journal-masthead h1 em { display:block; }
  .journal-intro { font-size:15px; line-height:1.9; }
  .journal-masthead-meta { gap:7px 10px; margin-top:17px; font-size:11px; }
  .journal-masthead-meta>span { display:none; }
  .journal-feature { gap:19px; margin-top:12px; margin-bottom:48px; }
  .feature-index>h2 { margin-block:8px 17px; font-size:24px; }
  .feature-index>h2 br { display:none; }
  .feature-selectors { gap:8px; }
  .feature-selector { grid-template-columns:20px minmax(0,1fr); align-items:center; gap:7px; min-height:68px; padding:12px; border-radius:13px; }
  .feature-selector strong { font-size:14px; line-height:1.6; }
  .feature-selector small { display:none; }
  .feature-selector>b { display:none; }
  .feature-number { font-size:11px; }
  .feature-panel { border-radius:20px; }
  .feature-art { height:270px; }
  .feature-copy { padding:22px; }
  .feature-copy>h2 { margin-block:10px 12px; font-size:25px; line-height:1.6; }
  .feature-copy>.summary { font-size:14px; line-height:1.9; }
  .feature-read-link { margin-top:13px; font-size:14px; }
  .feature-controls { margin-top:13px; }
  .editorial-art { gap:10px; padding:20px; }
  .editorial-art .art-kicker { font-size:10px; letter-spacing:.09em; }
  .editorial-art .art-caption { font-size:11px; }
  .editorial-art .art-orbit { width:210px; height:210px; }
  .art-bag-pair { gap:14px; }
  .art-bag-pair img { max-height:165px; }
  .art-bag-pair figcaption { font-size:11px; }
  .power-split { gap:18px; }
  .power-split strong { font-size:76px; }
  .power-split>b { font-size:23px; }
  .code-pair { gap:12px; }
  .code-pair>span { padding:15px 17px; border-radius:13px; font-size:38px; }
  .connection-lines { width:100%; gap:5px; }
  .connection-lines>span { padding:11px 20px; font-size:23px; }
  .journal-section-head { align-items:flex-start; gap:15px; margin-bottom:22px; }
  .journal-section-head h2 { font-size:29px; }
  .journal-section-head .eyebrow { font-size:10px; }
  .journal-section-head>span { padding-top:9px; font-size:12px; }
  .article-toolbar { flex-direction:column; align-items:stretch; gap:14px; padding-bottom:16px; }
  .article-tabs { gap:7px; }
  .article-tabs>button { padding:9px 14px; font-size:13px; }
  .article-search { width:100%; }
  .article-search input { min-height:44px; font-size:16px; }
  #article-result-count { margin-block:15px 22px; font-size:12px; }
  .journal-grid { grid-template-columns:1fr; gap:24px; }
  .journal-card { border-radius:20px; }
  .card-art { height:255px; }
  .card-art .editorial-art { padding:20px; }
  .card-art .art-bag-pair img { max-height:158px; }
  .card-art .power-split strong { font-size:76px; }
  .card-art .code-pair>span { padding:15px 17px; font-size:35px; }
  .card-art .connection-lines>span { padding:11px 18px; font-size:21px; }
  .journal-card-copy { padding:22px; }
  .journal-card-copy>h3 { font-size:22px; }
  .journal-card-copy>.summary { font-size:14px; }
  .card-read { font-size:14px; }
  .journal-paths { margin-top:48px; padding-top:30px; }
  .journal-path-grid { grid-template-columns:1fr; gap:14px; }
  .journal-path { position:relative; display:block; padding:22px; border-radius:18px; }
  .journal-path>span { min-height:30px; font-size:10px; }
  .journal-path>h2 { margin:14px 32px 10px 0; font-size:23px; }
  .journal-path>p { margin:0 20px 0 0; font-size:13px; }
  .journal-path>b { position:absolute; right:22px; top:22px; margin-top:0; font-size:24px; }
  .journal-latest { align-items:flex-start; flex-direction:column; gap:12px; margin-top:0; margin-bottom:44px; padding-top:26px; }
  .journal-latest>p { font-size:14px; }
  .journal-latest h2 { font-size:25px; }
  .journal-latest li { grid-template-columns:1fr; gap:5px; padding-block:14px; }
  .journal-latest li>a { font-size:14px; }
  .journal-tools-teaser { align-items:flex-start; flex-direction:column; gap:15px; margin-block:34px 28px; padding:24px; border-radius:18px; }
  .journal-tools-teaser h2 { font-size:23px; }
  .journal-tools-teaser p { font-size:14px; }
  .journal-index-intro { padding-block:8px 34px; }
  .journal-index-intro h1 { font-size:42px; }
  .journal-index-intro>p:last-child { font-size:15px; }
  .journal-index-footer { padding-block:28px 44px; }
  .catalogue-intro { padding-block:32px 12px; }
  .catalogue-intro h1 { font-size:36px; }
  .catalogue-intro>p:not(.eyebrow) { font-size:15px; }
  .catalogue-page .tools-section { padding-top:28px; padding-bottom:44px; }
  .article-page .detail-body>section>p { font-size:16px; line-height:2; }
}
@media (max-width:380px) {
  .site-header .brand { font-size:17px; }
  .site-header .header-cta { padding-inline:10px; }
  .journal-masthead h1 { font-size:41px; }
  .feature-selector { padding:11px 10px; grid-template-columns:18px minmax(0,1fr); gap:6px; }
  .feature-selector strong { font-size:13px; }
  .feature-selector small { font-size:11px; }
  .feature-art { height:245px; }
  .editorial-art { padding:17px; }
  .feature-copy { padding:20px; }
  .feature-copy>h2 { font-size:23px; }
  .power-split { gap:14px; }
  .power-split strong { font-size:64px; }
  .power-split>b { font-size:21px; }
  .code-pair { gap:9px; }
  .code-pair>span { padding:13px; font-size:32px; }
  .connection-lines>span { padding-inline:15px; font-size:21px; }
  .journal-section-head h2 { font-size:27px; }
  .article-tabs>button { padding-inline:12px; font-size:12px; }
  .card-art { height:235px; }
  .card-art .editorial-art { padding:18px; }
  .card-art .power-split strong { font-size:64px; }
  .card-art .code-pair>span { padding:13px; font-size:30px; }
  .card-art .connection-lines>span { padding-inline:13px; font-size:19px; }
  .journal-card-copy { padding:20px; }
  .journal-card-copy>h3 { font-size:21px; }
  .journal-path { padding:20px; }
  .journal-path>h2 { font-size:21px; }
  .journal-tools-teaser { padding:22px; }
  .journal-index-intro h1 { font-size:37px; }
  .catalogue-intro h1 { font-size:33px; }
}

.motion-off { scroll-behavior:auto!important; }
.motion-off *,.motion-off *::before,.motion-off *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
.motion-off [data-reveal],.motion-off [data-reveal].reveal-pending,.motion-off [data-reveal].is-visible { opacity:1!important; transform:none!important; }
.motion-off .feature-panel { opacity:1!important; transform:none!important; }
.motion-off .reading-progress { display:none; }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  [data-reveal],[data-reveal].reveal-pending,[data-reveal].is-visible,.feature-panel { opacity:1!important; transform:none!important; }
  .reading-progress { display:none; }
}