.ab-intro {
  position:relative;
  isolation:isolate;
  background: linear-gradient(105deg,#f4f9f5 5%,#f0f7f1);
  border-bottom: 1px solid #dce7df;
}
.ab-intro::before {
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:clamp(125px,21vw,350px);
  aspect-ratio:2409 / 2326;
  background:linear-gradient(135deg,transparent 20%,#028640 86%);
  mask:url("assets/nano-luc-giac-v07.webp") right bottom / contain no-repeat;
  transform:rotate(180deg);
  opacity:.15;
  z-index:-1;
  pointer-events:none;
}
.ab-intro > .v-wrap {width:min(1660px,calc(100% - clamp(40px,6vw,100px)))}
.ab-hero {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.05fr);
  align-items:center; gap:clamp(22px,3vw,48px); padding:clamp(8px,1.3vw,22px) 0 clamp(28px,3vw,48px);
}
.ab-hero .ab-intro-copy {padding:0; margin:0; min-width:0}
.ab-hero .v-title {margin:.18em 0 .25em}
.ab-hero .v-lead {max-width:none;text-wrap:pretty; margin-bottom:1.45em}
.ab-cover {min-width:0; margin:0}
.ab-cover img {display:block; width:100%; height:auto; border-radius:5px; object-fit:contain}
.ab-reading {
  display:grid; grid-template-columns:minmax(200px,.26fr) minmax(0,1fr); gap:clamp(34px,5.5vw,90px);
  align-items:start; padding-block:clamp(35px,5.3vw,82px);
}
.ab-toc {position:sticky; top:100px; padding:14px 0 0; border-top:3px solid #028640}
.ab-toc h2 {font-size:.95rem; margin:0 0 13px; letter-spacing:0}
.ab-toc ol,.ab-partners,.ab-chart-legend {list-style:none; padding:0; margin:0}
.ab-toc li {margin:0; padding:0}
.ab-toc a {display:flex; align-items:baseline; gap:.6em; padding:9px 7px 9px 0; border-bottom:1px solid #dce5df; color:#35463c; font-size:clamp(.8rem,1vw,.94rem); line-height:1.42}
.ab-toc a:is(:hover,:focus-visible,.current,.active,[aria-current="true"],[aria-current="location"]) {color:#028640; background:#f0f7f2}
.ab-chapters {min-width:0}
.ab-chapter {margin:0; padding:0 0 clamp(32px,4.3vw,62px); scroll-margin-top:8px}
.ab-chapter+.ab-chapter {border-top:1px solid #dbe5de; padding-top:clamp(30px,3.5vw,54px)}
.ab-heading {margin:0 0 1.2em}
.ab-heading>h2 {margin:0; font-size:clamp(1.6rem,2.6vw,2.7rem); line-height:1.13}
.ab-chapter p {line-height:1.72; margin:0 0 .85em}
.ab-chapter>p,.ab-letter p {max-width:none;text-wrap:pretty}
.ab-stat-grid .v-stats {display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); margin:24px 0}
.ab-stat-grid .v-stats dd,.ab-stat-grid .v-stats dt {min-width:0}
.ab-stat-grid .v-stats dd b {font-size:clamp(1.6rem,3vw,2.8rem)}
.ab-letter {padding:clamp(20px,3.3vw,44px); background:#f5f8f5}
.ab-letter .ab-letter-logo {display:block; width:clamp(65px,8vw,100px); height:auto; margin:0 0 12px auto}
.ab-letter p {font-family:inherit; letter-spacing:normal; word-spacing:normal}
.ab-letter > p:not(.ab-salutation, .ab-signature) {text-align:start}
.ab-letter .ab-salutation {font-weight:700; color:#22392c; padding-top:4px}
.ab-letter .ab-signature {margin:1.5em 0 0; color:#028640; font-weight:700}
.ab-chart {margin:1.3em 0 0; padding:clamp(14px,2.2vw,32px); border:1px solid #dae6dd; border-radius:4px}
.ab-chart figcaption {display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 16px; justify-content:space-between}
.ab-chart figcaption strong {font-size:clamp(1rem,1.3vw,1.24rem)}
.ab-chart figcaption>span,.ab-data summary {color:#4f6557; font-size:.83rem}
.ab-chart-keys {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 16px; margin:12px 0 22px}
.ab-chart-legend {display:flex; gap:5px 16px; flex-wrap:wrap}
.ab-trend-key {display:inline-flex; align-items:center; gap:5px; white-space:nowrap; color:#45564a; font-size:.76rem; font-variant-numeric:tabular-nums}
.ab-trend-key::before {content:""; width:16px; height:3px; background:#df2337; border-radius:2px}
.ab-trend {position:absolute; inset:0 0 auto; height:var(--plot-height); z-index:0; pointer-events:none; color:#df2337; --tip-x:98%; --tip-y:3%}
.ab-trend svg {display:block; width:100%; height:100%; clip-path:inset(-4px calc(100% - var(--tip-x)) -4px 0)}
.ab-trend path {fill:none; stroke:currentColor; stroke-width:clamp(2.5px,.28vw,4px); stroke-linecap:round}
.ab-trend-tip {position:absolute; left:var(--tip-x); top:var(--tip-y); width:clamp(10px,1.15vw,17px); aspect-ratio:1.25; background:currentColor; clip-path:polygon(0 0,100% 50%,0 100%,20% 50%); transform-origin:right center; transform:translate(-100%,-50%) rotate(var(--tip-angle,-25deg))}
.ab-chart-legend li {display:flex; gap:5px; align-items:center; font-size:.78rem}
.ab-chart-legend li>span {width:9px; height:9px; border-radius:2px}
.ab-series-0 {background:#028640}
.ab-series-1 {background:#397c8c}
.ab-series-2 {background:#9acb45}
.ab-plot {display:grid; grid-template-columns:23px 1fr; margin-block:18px; --plot-height:clamp(164px,21vw,268px)}
.ab-axis {display:flex; justify-content:space-between; flex-direction:column; height:var(--plot-height); font-size:.7rem; line-height:1; color:#677b6f; padding-right:5px; text-align:right}
.ab-chart-groups {display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:3%; position:relative}
.ab-chart-groups::before {content:""; position:absolute; top:0; inset-inline:0; height:var(--plot-height); border-bottom:1px solid #b6c7bb; background:repeating-linear-gradient(to bottom,#e1e8e2 0 1px,transparent 1px 25%); z-index:0}
.ab-chart-group {min-width:0; text-align:center; z-index:1}
.ab-chart-group>strong,.ab-chart-group>small {display:block; font-size:.82rem}
.ab-chart-group>strong {padding-top:7px}
.ab-chart-group>small {font-size:.66rem; color:#49633e}
.ab-outlook {border-radius:3px; background:rgba(153,205,80,.11)}
.ab-bars {display:flex; align-items:flex-end; justify-content:center; height:var(--plot-height); gap:4px}
.ab-bar {position:relative; display:block; width:23%; max-width:28px; height:var(--height); min-height:3px; border-radius:2px 2px 0 0}
.ab-bar b {position:absolute; bottom:calc(100% + 1px); left:50%; transform:translateX(-50%); color:#273e30; text-shadow:0 0 3px white,0 0 2px white; font-size:clamp(.58rem,.85vw,.73rem); line-height:1.2; font-variant-numeric:tabular-nums}
@media(max-width:360px){
  html[lang="en"] .ab-bar:first-child b{left:20%}
  html[lang="en"] .ab-bar:last-child b{left:80%}
}
.ab-data {border-top:1px solid #dbe6df}
.ab-data summary {cursor:pointer; padding:12px 0; font-weight:650; color:#028640}
.ab-table-scroll {overflow-x:auto}
.ab-table {width:100%; border-collapse:collapse; color:#314337; font-size:clamp(.76rem,1vw,.91rem)}
.ab-table caption {text-align:left; color:#52695a; padding:3px 0 9px}
.ab-table td,.ab-table th {text-align:left; vertical-align:top; padding:8px 6px; border-bottom:1px solid #dce7df}
.ab-vision {display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:clamp(16px,3vw,36px); align-items:center}
.ab-vision img {display:block; width:100%; height:auto; border-radius:4px; object-fit:contain}
.ab-vision .ab-vision-lead {border-top:1px solid #cddfd2; padding-top:17px; font-size:clamp(1.05rem,1.3vw,1.27rem); line-height:1.5; font-weight:650; color:var(--green)}
.ab-subtitle {font-size:1.2rem; margin:0 0 .6em}
.ab-vision + .ab-subtitle {margin-top:1.6em}
.ab-items {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(20px,3.1vw,42px); margin:0}
.ab-items>div {border-top:1px solid #cddfd2; padding:17px 0}
.ab-items dt {font-weight:700; color:#028640; margin-bottom:5px; line-height:1.45; font-size:1.05rem}
.ab-items dd {margin:0; color:#435249; line-height:1.58}
.ab-quote {margin:0 0 1.2em; padding:.5em 0; font-weight:650; font-size:clamp(1.12rem,1.8vw,1.6rem); line-height:1.38; color:var(--green)}
.ab-org-chart {display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; margin:0}
.ab-org-chart figcaption {font-size:1.05rem; font-weight:650; line-height:1.35; color:var(--ink)}
.ab-zoom-control {position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap}
.ab-zoom-label {display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:6px 12px; border:1px solid #a4c7b1; border-radius:3px; color:#096d38; cursor:pointer; font-weight:650; font-size:.85rem}
.ab-zoom-label:hover {background:#f0f7f2}
.ab-zoom-control:focus-visible+.ab-zoom-label,.ab-org-canvas:focus-visible {outline:2px solid #028640; outline-offset:3px}
.ab-zoom-out,.ab-zoom-control:checked+.ab-zoom-label .ab-zoom-in {display:none}
.ab-zoom-control:checked+.ab-zoom-label .ab-zoom-out {display:inline}
.ab-org-canvas {grid-column:1/-1; min-width:0; width:100%; max-height:none; overflow:hidden; border:1px solid #d9e4dc; border-radius:4px}
.ab-org-canvas img,.ab-org-canvas .ab-org-diagram {display:block; width:100%; height:auto; object-fit:contain}
.ab-zoom-control:checked~.ab-org-canvas {max-height:76vh; overflow:auto; overscroll-behavior-x:contain}
.ab-zoom-control:checked~.ab-org-canvas img,.ab-zoom-control:checked~.ab-org-canvas .ab-org-diagram {width:max(100%,1580px); max-width:none}
.ab-org-list {margin:15px 0 0; color:var(--ink)}
.ab-org-list summary {font-size:.92rem; font-weight:650; color:#086d39; cursor:pointer}
.ab-org-list dl {max-width:75ch; margin:16px 0 0}
.ab-org-list dt {margin-top:12px; font-weight:700}
.ab-org-list dd {margin:3px 0 0}
.ab-org-list dd p {margin:0}
.ab-org-list ul {margin:6px 0 0; padding-left:1.35em; columns:2; column-gap:2rem}
.ab-org-list li {break-inside:avoid}
.ab-partners {display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); margin:1.3em 0 1.6em; border-top:1px solid #e2e9e4; border-left:1px solid #e2e9e4}
.ab-partners li {height:clamp(48px,5.6vw,76px); padding:clamp(7px,1.15vw,17px); display:grid; place-items:center; border-right:1px solid #e2e9e4; border-bottom:1px solid #e2e9e4}
.ab-partners img {display:block; width:100%; height:100%; max-width:122px; max-height:47px; object-fit:contain}
@media(max-width:940px) {
  .ab-reading {grid-template-columns:190px minmax(0,1fr); gap:25px}
  .ab-stat-grid .v-stats {grid-template-columns:repeat(3,minmax(0,1fr))}
  .ab-partners {grid-template-columns:repeat(5,minmax(0,1fr))}
}
/* English About prose shares one reading rhythm and justified margins. */
html[lang="en"] :is(
  .ab-intro-copy > .v-lead,
  .ab-chapter > p,
  .ab-letter > p:not(.ab-salutation, .ab-signature),
  .ab-vision > div > p,
  .ab-items dd,
  .ab-quote,
  .ab-org-list dd > p
) {
  font-family:inherit;
  line-height:1.72;
  text-align:justify;
  text-align-last:start;
  text-justify:inter-word;
  text-wrap:wrap;
  hyphens:none;
  word-break:normal;
  overflow-wrap:normal;
  letter-spacing:normal;
  word-spacing:normal;
}
html[lang="en"] :is(
  .ab-chapter > p,
  .ab-letter > p:not(.ab-salutation, .ab-signature),
  .ab-vision > div > p:not(.ab-vision-lead),
  .ab-items dd,
  .ab-org-list dd > p
) {font-size:16px}

@media(max-width:760px) {
  .ab-intro > .v-wrap {width:calc(100% - 36px)}
  .ab-hero {grid-template-columns:1fr; gap:14px; padding-top:5px}
  .ab-cover {margin-inline:-10px}
  .ab-reading {display:block; padding-block:22px 40px}
  .ab-toc {position:static; border-top-width:2px; margin:0 0 30px; padding:13px 0 0}
  .ab-toc h2 {margin-bottom:4px}
  .ab-toc ol {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px}
  .ab-toc a {height:100%; font-size:.85rem}
  .ab-chapter {scroll-margin-top:8px}
  .ab-stat-grid .v-stats {grid-template-columns:repeat(3,minmax(0,1fr))}
  .ab-vision {grid-template-columns:1fr}
}
@media(max-width:480px) {
  .ab-items {display:block}
  .ab-toc ol {gap:0 8px}
  .ab-toc a {font-size:.79rem; gap:4px}
  .ab-stat-grid .v-stats {grid-template-columns:repeat(2,minmax(0,1fr))}
  .ab-bars {gap:2px}
  .ab-chart-groups {gap:2%}
  .ab-outlook>small {font-size:.57rem}
  .ab-org-chart {gap:8px}
  .ab-org-chart figcaption {font-size:.94rem}
  .ab-zoom-label {padding:6px 8px; font-size:.77rem}
  .ab-org-list ul {columns:1}
  .ab-partners {grid-template-columns:repeat(3,minmax(0,1fr))}
}
