/* A readable sequence: every step remains visible, one signal moves through it. */
.story-signal{position:relative;margin-bottom:52px}
.story-signal .story-map{
 display:grid;grid-template-columns:1fr 1.5fr .85fr 1.25fr;gap:32px;
 margin:0;padding:0;
}
.story-signal .story-map li{
 position:relative;gap:12px;min-height:62px;padding:12px 0;
 border-top:0;border-bottom:2px solid #e5ebdc;
 color:#73816b;font-size:12px;transition:color .3s,border-color .3s;
}
.story-signal .story-map li+li:before{
 position:absolute;left:-25px;top:50%;transform:translateY(-50%);
 margin:0;color:#b0bda4;font-size:16px;
}
.story-signal .story-map span{
 flex:none;display:grid;place-items:center;width:30px;height:30px;
 border:1px solid #dce6d0;border-radius:50%;font-size:10px;color:#71825e;
 transition:background-color .3s,color .3s,border-color .3s;
}
.story-signal .story-map .is-flow-active{color:#253d2d;border-color:#abc839}
.story-signal .story-map .is-flow-active>span{background:var(--accent);border-color:var(--accent);color:#253d2d}
.story-signal .story-map .is-flow-active:before{color:#779327}
.story-signal-toggle{
 display:flex;align-items:center;gap:6px;margin:12px 0 0 auto;
 padding:5px 9px;min-height:30px;border:0;border-radius:20px;
 background:transparent;color:#6c7d5c;font:inherit;font-size:10px;cursor:pointer;
}
.story-signal-toggle[hidden]{display:none}
.story-signal-toggle:hover{background:#f0f5e7}
.story-signal-toggle:focus-visible{outline:2px solid #718b44;outline-offset:2px}
/* NUGAMAG is our operating publication, with room and contrast of its own. */
.reference-panel.nuga-finale{
 width:min(1320px,calc(100% - 72px));min-height:720px;
 grid-template-columns:1fr 1.05fr;margin:110px auto 70px;
 background:radial-gradient(ellipse at 90% 8%,#45613d 0,transparent 58%),#142f26;
 color:#f8f9ef;border-radius:28px;isolation:isolate;
}
.nuga-finale .reference-copy{padding:58px 48px;justify-content:center;min-width:0}
.nuga-finale .reference-copy>p.nuga-owned-label{
 display:flex;align-items:center;gap:9px;margin:0 0 25px;
 color:#c1d2b3;font-size:9px;letter-spacing:.05em;line-height:1.8;
}
.nuga-owned-label>span{flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.nuga-finale .reference-copy h3{
 margin:0 0 30px;font-size:clamp(48px,5.2vw,76px);font-weight:750;
 line-height:1;letter-spacing:-.065em;color:var(--accent);
}
.nuga-finale .nuga-editorial{
 margin:0 0 22px;font-size:clamp(26px,2.7vw,37px);color:#fff;line-height:1.4;
}
.nuga-finale .nuga-editorial em{color:var(--accent);background:none}
.nuga-finale .reference-copy>p:not([class]){
 margin:0 0 18px;font-size:14px;line-height:1.95;color:#bdcdb7;max-width:440px;
}
.nuga-finale .reference-copy>p.nuga-lead{color:#f5f8ec;font-size:16px}
.nuga-practice{
 display:flex;align-items:center;gap:14px;margin:14px 0 29px;padding:17px 0;
 border-block:1px solid #96b28a3d;font-size:10px;letter-spacing:.045em;color:#e0edcf;
}
.nuga-practice i{font-size:15px;color:var(--accent);font-style:normal}
.nuga-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.nuga-finale .reference-copy .nuga-actions .text-link{
 margin:0;padding:13px 18px;border-radius:30px;background:var(--accent);
 color:#193425;font-size:12px;gap:20px;
}
.nuga-case-link{font-size:11px;color:#d0dfc7;text-underline-offset:5px}
.nuga-case-link:hover{text-decoration:underline}
.reference-panel.nuga-finale .reference-image{height:100%;min-height:720px;padding:70px 0 0 15px}
.reference-panel.nuga-finale .reference-image>img:first-child{
 width:calc(100% - 28px);border:5px solid #dbe6cf;box-shadow:0 24px 70px #06191066;
}
.reference-panel.nuga-finale .reference-image>.nuga-phone{
 width:32%;right:24px;bottom:32px;border-color:#dbe6cf;box-shadow:0 20px 60px #06191088;
}
/* Keep expanded brand names within the existing portfolio grid. */
.project-caption>div{min-width:0}
.project-caption h3{overflow-wrap:anywhere}
.project-caption>p{flex-shrink:0}
@media(max-width:1100px){
 .nuga-finale .reference-copy{padding:40px 30px}
 .nuga-actions{gap:18px}
 .nuga-practice{gap:10px;font-size:9px}
 .nuga-finale .reference-copy>p.nuga-lead{font-size:14px}
 .nuga-finale .reference-copy>p:not([class]){font-size:13px}
}
@media(max-width:900px){
 .story-signal .story-map{gap:25px;grid-template-columns:1fr 1.45fr .8fr 1.2fr}
 .story-signal .story-map li{font-size:10px;gap:8px}
 .story-signal .story-map li+li:before{left:-20px;font-size:13px}
 .story-signal .story-map span{width:26px;height:26px;font-size:9px}
 .reference-panel.nuga-finale{grid-template-columns:1fr 1fr;width:calc(100% - 40px)}
 .nuga-finale .reference-copy{padding:36px 25px}
 .nuga-finale .reference-copy h3{font-size:45px}
 .nuga-finale .nuga-editorial{font-size:26px}
 .nuga-practice{gap:8px;font-size:8px}
 .reference-panel.nuga-finale .reference-image>.nuga-phone{width:43%;right:15px;bottom:65px}
}
@media(max-width:680px){
 .story-signal{margin-bottom:35px}
 .story-signal .story-map{grid-template-columns:1fr 1fr;gap:8px 20px}
 .story-signal .story-map li{min-height:58px;font-size:10px;gap:9px;line-height:1.6}
 .story-signal .story-map li+li:before{display:none}
 .story-signal-toggle{font-size:9px;margin-top:10px}
 .reference-panel.nuga-finale{
  display:flex;flex-direction:column;width:calc(100% - 24px);
  min-height:0;margin:65px auto 42px;border-radius:23px;
 }
 .nuga-finale .reference-copy{display:block;padding:36px 26px 15px}
 .nuga-finale .reference-copy>p.nuga-owned-label{font-size:8px;margin-bottom:22px}
 .nuga-finale .reference-copy h3{font-size:clamp(43px,13vw,65px);margin-bottom:25px}
 .nuga-finale .nuga-editorial{font-size:clamp(25px,6.8vw,34px);margin-bottom:21px}
 .nuga-finale .reference-copy>p:not([class]){font-size:13px;line-height:1.9}
 .nuga-finale .reference-copy>p.nuga-lead{font-size:14px}
 .nuga-practice{font-size:9px;gap:11px;margin-block:22px}
 .nuga-actions{gap:18px}
 .nuga-finale .reference-copy .nuga-actions .text-link{font-size:11px;padding:12px 16px;gap:15px}
 .nuga-case-link{font-size:10px}
 .reference-panel.nuga-finale .reference-image{height:430px;min-height:0;padding:42px 0 0 24px}
 .reference-panel.nuga-finale .reference-image>.nuga-phone{width:31%;right:18px;bottom:-20px;border-width:4px}
 .reference-panel.nuga-finale .reference-image>img:first-child{border-width:3px}
}
@media(max-width:360px){
 .nuga-finale .reference-copy{padding-inline:22px}
 .nuga-practice{gap:8px;font-size:8px}
 .reference-panel.nuga-finale .reference-image{height:360px}
 .nuga-finale .reference-copy>p.nuga-lead br{display:none}
}
@media(prefers-reduced-motion:reduce){
 .story-signal .story-map li,.story-signal .story-map span{transition:none}
}
