/* ==========================================================================
   SECTION 4 — MANUFACTURING PROCESS (now nested inside the merged
   "Why Arkana + Manufacturing Process" section — see why-arkana.css)
   ========================================================================== */

.jrn-subheader{text-align:center;max-width:700px;margin:16px auto 64px;padding-top:56px;border-top:1px solid var(--border);}
.jrn-subheader-label{display:block;font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--primary);margin-bottom:14px;}
.jrn-subheader-title{font-size:clamp(26px,3.2vw,36px);color:#fff;margin-bottom:14px;line-height:1.15;}
.jrn-subheader-desc{font-size:15px;line-height:1.8;color:var(--text-secondary);}

.jrn-wrap{margin-bottom:72px;}

.jrn-nodes{
  position:relative;display:flex;justify-content:space-between;
  align-items:flex-start;padding-top:44px;
}
.jrn-line-track{position:absolute;top:70px;left:26px;right:26px;height:2px;z-index:0;}
.jrn-line-bg{position:absolute;inset:0;background:var(--border);border-radius:2px;}
.jrn-line-fill{
  position:absolute;top:0;left:0;height:100%;width:0%;
  background:linear-gradient(90deg,#A63D2E,#C24A37);border-radius:2px;transition:width .1s linear;
}
.jrn-traveler{
  position:absolute;top:24px;left:0;width:36px;height:36px;
  background:var(--primary);border-radius:10px;
  display:flex;align-items:center;justify-content:center;z-index:4;
  box-shadow:0 0 16px rgba(166,61,46,.5);
  transform:translateX(calc(-50% + 26px));
}
.jrn-traveler svg{width:18px;height:18px;}
.jrn-node{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:0;cursor:pointer;width:52px;flex-shrink:0;}
.jrn-node-ring{position:absolute;top:-10px;left:-10px;width:72px;height:72px;border-radius:50%;border:1.5px solid rgba(166,61,46,.4);opacity:0;pointer-events:none;transition:opacity .4s ease;}
.jrn-node-circle{
  width:52px;height:52px;border-radius:50%;border:1.5px solid #3C382F;background:#2A2721;
  display:flex;align-items:center;justify-content:center;color:#4a4a4a;position:relative;z-index:1;
  transition:border-color .4s ease,color .4s ease,box-shadow .4s ease,background .4s ease;
}
.jrn-node-circle svg{width:20px;height:20px;}
.jrn-node-meta{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:12px;}
.jrn-node-num{font-family:'Barlow Condensed',sans-serif;font-size:13px;letter-spacing:1px;color:#3A3A3A;transition:color .4s ease;}
.jrn-node-title{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#3A3A3A;text-align:center;transition:color .4s ease;white-space:nowrap;}
.jrn-node-desc{display:none;}

.jrn-node.is-active .jrn-node-ring{opacity:1;animation:jrnRingPulse 2s ease-out infinite;}
.jrn-node.is-active .jrn-node-circle{border-color:#A63D2E;color:#fff;background:#1a0306;box-shadow:0 0 24px rgba(166,61,46,.35);}
.jrn-node.is-active .jrn-node-num{color:var(--primary);}
.jrn-node.is-active .jrn-node-title{color:#fff;}
.jrn-node.is-done .jrn-node-circle{border-color:rgba(255,255,255,.35);color:rgba(255,255,255,.7);background:#2A2721;}
.jrn-node.is-done .jrn-node-num{color:rgba(255,255,255,.5);}
.jrn-node.is-done .jrn-node-title{color:rgba(255,255,255,.45);}

@keyframes jrnRingPulse{0%{transform:scale(1);opacity:.7;}70%{transform:scale(1.25);opacity:0;}100%{transform:scale(1.25);opacity:0;}}

.jrn-desc-panel{margin-top:48px;min-height:80px;position:relative;}
.jrn-desc-item{position:absolute;top:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;opacity:0;pointer-events:none;transition:opacity .35s ease;white-space:nowrap;}
.jrn-desc-item.is-active{opacity:1;pointer-events:auto;}
.jrn-desc-num{font-family:'Barlow Condensed',sans-serif;font-size:42px;line-height:1;color:rgba(166,61,46,.25);flex-shrink:0;}
.jrn-desc-title{font-size:18px;font-weight:700;letter-spacing:-.01em;color:#fff;flex-shrink:0;}
.jrn-desc-text{font-size:14px;color:var(--text-secondary);border-left:2px solid #3C382F;padding-left:16px;line-height:1.55;max-width:320px;white-space:normal;}

.jrn-timeline{margin-top:80px;}
.jrn-tl-hdr{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);text-align:center;margin-bottom:28px;}
.jrn-tl-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.jrn-tl-card{background:#2A2721;border:1px solid var(--border);border-top:2px solid var(--primary);border-radius:14px;padding:20px 18px;opacity:0;transition:border-color .3s ease,box-shadow .3s ease;}
.jrn-tl-card:hover{border-color:#3a3a3a;box-shadow:0 6px 22px rgba(166,61,46,.1);}
.jrn-tl-phase{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-secondary);margin-bottom:10px;}
.jrn-tl-days{font-family:'Barlow Condensed',sans-serif;font-size:22px;letter-spacing:.04em;color:#fff;line-height:1;}

@media(max-width:1100px){.jrn-tl-cards{grid-template-columns:repeat(3,1fr);}}
@media(max-width:900px){
  .jrn-desc-item{white-space:normal;flex-wrap:wrap;text-align:center;justify-content:center;}
  .jrn-desc-text{border-left:none;padding-left:0;border-top:1px solid #3C382F;padding-top:10px;margin-top:6px;}
}
@media(max-width:767px){
  .jrn-nodes{flex-direction:column;align-items:flex-start;gap:0;padding-top:0;padding-left:26px;}
  .jrn-line-track{top:0;bottom:0;left:26px;right:auto;width:2px;height:auto;}
  .jrn-line-fill{width:2px;height:0%;top:0;}
  .jrn-traveler{display:none;}
  .jrn-node{flex-direction:row;width:auto;gap:16px;padding:20px 0;border-bottom:1px solid #1a1a1a;align-items:flex-start;}
  .jrn-node:last-child{border-bottom:none;}
  .jrn-node-ring{top:-10px;left:-10px;width:72px;height:72px;}
  .jrn-node-meta{align-items:flex-start;margin-top:0;}
  .jrn-node-num{font-size:12px;}
  .jrn-node-title{font-size:13px;letter-spacing:.04em;text-align:left;}
  .jrn-node-desc{display:block;font-size:12px;color:#5a5a5a;line-height:1.55;margin-top:4px;max-width:240px;transition:color .4s ease;}
  .jrn-node.is-active .jrn-node-desc{color:var(--text-secondary);}
  .jrn-node.is-done .jrn-node-desc{color:#4a4a4a;}
  .jrn-desc-panel{display:none;}
  .jrn-tl-cards{grid-template-columns:1fr 1fr;}
}
@media(max-width:480px){.jrn-tl-cards{grid-template-columns:1fr;}}