/* ============ REVERA v5 layer — loaded after styles.css + v3.css ============ */

/* Hero: no tiles, content vertically balanced, aligned with brand column */
.hero{justify-content:center}
.hero-inner{padding-block:10rem 7rem}
.hero h1{max-width:14ch}

/* ============ River v5: larger, lighter blue, card docked below ============ */
.river-sec{background:linear-gradient(180deg,#0D4680 0%,#15599C 55%,#1B65AE 100%);color:#DCEBFA;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:7.5rem;padding-bottom:1rem}
.river-sec .sec-head{margin-bottom:1rem}
.river-sec .sec-head h2{font-size:clamp(1.7rem,2.8vw,2.4rem)}
.river-sec .lead{font-size:1.02rem;margin-top:.6rem}
@media (max-height:820px){.river-sec .lead{display:none}.river-sec{padding-top:6.5rem}}
.river-sec h2{color:#fff}
.river-sec .lead{color:#CBE0F5}
.river-sec .eyebrow{color:#9FE0C6}
.river-wrap{width:min(94vw,1440px);margin-inline:auto}
.river-svg{width:100%;height:auto;max-height:min(44svh,430px);min-height:260px}
.rnode text{font-size:16px;fill:#CFE2F5}
.rnode .ring{fill:#0B3B6C;stroke:rgba(214,231,248,.55)}
.rnode .core{fill:rgba(214,231,248,.7)}
.river-base{stroke:rgba(214,231,248,.32);stroke-width:3.5}
.river-flow{stroke-width:3.5}
.river-progress{stroke-width:4}
.river-card{position:static;width:min(660px,100%);margin:.9rem auto 0;background:rgba(5,38,70,.5);border:1px solid rgba(159,224,198,.3);padding:1.05rem 1.45rem;text-align:left}
.river-card h3{font-size:1.18rem;margin:.2rem 0 .25rem}
.river-card p{font-size:.88rem;color:#CFE2F5}
.river-card .rc-k{font-size:.68rem}
.river-card .rc-next{margin-top:.45rem;font-size:.66rem}
.river-hint{display:none}
.river-card .rc-next{color:#8FD8BC}
.river-hint{color:#A8C6E4}

/* ============ Expertise v5 ============ */
.rotator{min-height:calc(100svh - 64px)}
.rot-inner{padding-block:10rem 4.5rem}
.rot-dots{display:none}
.xp-tabsbar{height:64px;display:flex;align-items:center;box-shadow:0 1px 0 var(--hairline);top:84px!important}
.xp-tabsbar .wrap{width:100%}

/* Metro explorer */
.metro{display:grid;grid-template-columns:minmax(320px,11fr) minmax(0,13fr);gap:clamp(1.6rem,3.5vw,3rem);align-items:center}
.m-map{width:100%;height:auto;overflow:visible}
.m-map .track{fill:none;stroke:color-mix(in srgb,var(--pc,#185FA5) 20%,transparent);stroke-width:3.5;stroke-linecap:round}
.m-map .flow{fill:none;stroke:var(--pc,#185FA5);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:2 14;animation:mmflow 2.2s linear infinite;opacity:.8}
@keyframes mmflow{to{stroke-dashoffset:-16}}
@media (prefers-reduced-motion:reduce){.m-map .flow{animation:none;stroke-dasharray:none;opacity:.35}}
.m-map .st{cursor:pointer}
.m-map .st .ring{fill:#fff;stroke:var(--slate-l);stroke-width:2;transition:.35s}
.m-map .st .ico{stroke:var(--slate);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:.35s}
.m-map .st .node{fill:#fff;stroke:var(--slate-l);stroke-width:2.4;transition:.35s}
.m-map .st .snum{font:600 11px Archivo,sans-serif;fill:var(--slate-l);letter-spacing:.06em;transition:.3s}
.m-map .st .slbl{font:600 12.5px Archivo,sans-serif;fill:var(--slate);transition:.3s}
.m-map .st:hover .slbl{fill:var(--channel-dark)}
.m-map .st.on .ring{fill:var(--pc,#185FA5);stroke:var(--pc,#185FA5)}
.m-map .st.on .ico{stroke:#fff}
.m-map .st.on .node{fill:var(--pc,#185FA5);stroke:var(--pc,#185FA5)}
.m-map .st.on .snum{fill:var(--pc,#185FA5)}
.m-map .st.on .slbl{fill:var(--channel-dark)}
.m-mobile{display:none}
@media (max-width:900px){.metro{grid-template-columns:1fr}.m-map{display:none}.m-mobile{display:block}}
@media (max-width:900px){.metro{grid-template-columns:1fr;min-height:0}}
.m-line{list-style:none;position:relative;padding-left:6px;align-self:center;width:100%}
.m-line::before{content:"";position:absolute;left:15px;top:14px;bottom:14px;width:3px;border-radius:2px;background:color-mix(in srgb,var(--pc,#185FA5) 18%,transparent)}
.m-line::after{content:"";position:absolute;left:15px;top:14px;bottom:14px;width:3px;border-radius:2px;background:repeating-linear-gradient(180deg,var(--pc,#185FA5) 0 7px,transparent 7px 20px);animation:mflow 2.4s linear infinite;opacity:.8}
@keyframes mflow{to{background-position:0 20px}}
@media (prefers-reduced-motion:reduce){.m-line::after{animation:none;opacity:.4}}
.m-stop{display:flex;align-items:center;gap:1rem;width:100%;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--sans);padding:.62rem 0 .62rem 0;position:relative}
.m-stop .dot{flex:none;width:15px;height:15px;margin-left:3.5px;border-radius:50%;background:var(--paper);border:2.5px solid var(--slate-l);transition:.35s var(--ease);position:relative;z-index:2}
.m-stop .num{flex:none;font-family:var(--serif);font-weight:600;font-size:.85rem;color:var(--slate-l);width:1.6rem;transition:color .35s}
.m-stop .lbl{font-weight:600;font-size:1.02rem;color:var(--slate);transition:color .35s,transform .35s var(--ease)}
.m-stop:hover .lbl{color:var(--channel-dark)}
.m-stop[aria-selected="true"] .dot{background:var(--pc,#185FA5);border-color:var(--pc,#185FA5);box-shadow:0 0 0 6px color-mix(in srgb,var(--pc,#185FA5) 16%,transparent)}
.m-stop[aria-selected="true"] .num{color:var(--pc,#185FA5)}
.m-stop[aria-selected="true"] .lbl{color:var(--channel-dark);transform:translateX(4px)}

.m-panel{position:relative;border-radius:var(--r-lg);border:1px solid var(--hairline);background:var(--raised);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;padding:1.9rem 2.2rem 2.1rem;box-shadow:var(--shadow-1);isolation:isolate}
.m-panel::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--pc,#185FA5),color-mix(in srgb,var(--pc,#185FA5) 40%,#57BE96))}
.m-panel .mp-bg{position:absolute;inset:0;z-index:-1;object-fit:cover;width:100%;height:100%;opacity:.08;filter:saturate(.4)}
.m-panel .mp-ghost{position:absolute;right:1.4rem;bottom:.2rem;font-family:var(--serif);font-weight:700;font-size:clamp(3.6rem,6vw,5.2rem);line-height:1;color:color-mix(in srgb,var(--pc,#185FA5) 9%,transparent);user-select:none}
.m-panel .chip{margin-bottom:1rem;width:44px;height:44px}
.m-panel .chip svg{width:20px;height:20px}
.m-panel .mp-k{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--pc,#185FA5);margin-bottom:.5rem;max-width:none}
.m-panel h3{font-size:clamp(1.45rem,2.2vw,1.9rem);margin-bottom:.6rem}
.m-panel p{font-size:1rem;color:var(--body);max-width:none}
.m-panel .mp-in{transition:opacity .28s var(--ease),transform .28s var(--ease)}
.m-panel.swap .mp-in{opacity:0;transform:translateY(10px)}
.m-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:color-mix(in srgb,var(--pc,#185FA5) 12%,transparent)}
.m-progress i{position:absolute;inset:0 auto 0 0;width:100%;background:var(--pc,#185FA5);transform-origin:left;transform:scaleX(0)}
.m-progress i.run{animation:mprog var(--dur,6s) linear forwards}
@keyframes mprog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.m-progress{display:none}}


/* ============ Founders drawer ============ */
.folio .folio-bio{display:none}
.folio-photo{aspect-ratio:640/680}
.folio.sel{outline:2px solid var(--current);outline-offset:2px}
.folio-drawer{grid-column:1/-1;max-height:0;overflow:hidden;transition:max-height .6s var(--ease)}
.fd-in{background:var(--raised);border:1px solid var(--hairline);border-left:4px solid var(--current);border-radius:var(--r);padding:1.6rem 1.9rem;display:flex;justify-content:space-between;gap:1.4rem;opacity:0;transform:translateY(10px);transition:opacity .4s var(--ease) .15s,transform .4s var(--ease) .15s}
.folio-drawer.open .fd-in{opacity:1;transform:none}
.fd-in h3{font-size:1.4rem}
.fd-in .role{font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--current-deep);font-weight:600;margin:.25rem 0 .9rem}
.fd-in p{max-width:none;color:var(--body)}
.fd-in .cred{margin-top:.8rem;font-family:var(--serif);font-style:italic;font-size:.9rem;color:var(--slate)}
.fd-close{flex:none;width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(12,68,124,.25);background:none;cursor:pointer;color:var(--channel-dark);font-size:1rem;line-height:1;transition:.3s}
.fd-close:hover{background:var(--current);border-color:var(--current);color:#fff}


/* ============ River v7 — signature full-bleed lifecycle ============ */
.river-hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;isolation:isolate;padding:6.8rem 0 1.6rem;background:linear-gradient(180deg,#041F3C 0%,#07305A 48%,#0A3E71 100%);color:#DCEBFA}
.rh-aurora{position:absolute;inset:-30% -10%;z-index:-1;background:
  radial-gradient(34% 40% at 20% 72%,rgba(29,158,117,.16),transparent 70%),
  radial-gradient(40% 46% at 82% 24%,rgba(55,138,221,.17),transparent 70%);
  filter:blur(8px);animation:aurora 16s var(--ease) infinite alternate}
.rh-head{display:block;margin-bottom:.2rem}
.rh-head h2{color:#fff;font-size:clamp(1.5rem,2.6vw,2.4rem);max-width:none;white-space:nowrap}
@media (max-width:760px){.rh-head h2{white-space:normal}}
.rh-lead{font-family:var(--serif);font-style:italic;font-size:clamp(.98rem,1.2vw,1.12rem);line-height:1.55;color:#A9C9EA;max-width:38ch;padding-bottom:.4rem}
@media (max-height:820px){.rh-lead{display:none}}
@media (max-width:820px){.rh-lead{display:none}}

.rh-canvas{position:relative;width:100%;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:0}
.river-hero .river-svg{width:100%;height:auto;max-height:min(54svh,560px);min-height:280px;overflow:visible;display:block}
.river-leader{fill:none;stroke:url(#riverGrad);stroke-width:2;opacity:.85;filter:drop-shadow(0 0 5px rgba(87,190,150,.4));transition:stroke-dashoffset .7s var(--ease)}
@media (prefers-reduced-motion:reduce){.river-leader{display:none}}

.river-hero .river-bed{fill:none;stroke:rgba(120,180,235,.09);stroke-width:26;stroke-linecap:round}
.river-hero .river-base{stroke:rgba(181,212,244,.22);stroke-width:3.5}
.river-hero .river-flow{stroke-width:3.5}
.river-hero .river-progress{stroke-width:4;filter:drop-shadow(0 0 6px rgba(87,190,150,.45))}
.river-comet{fill:#9FE0C6;opacity:.95}
@media (prefers-reduced-motion:reduce){.river-comet{display:none}}

.river-hero .rnode .halo{fill:#57BE96;opacity:0}
.river-hero .rnode.active .halo{opacity:.16;animation:breathe 2.6s var(--ease) infinite}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.16}50%{transform:scale(1.28);opacity:.07}}
.river-hero .rnode .halo{transform-origin:center;transform-box:fill-box}
@media (prefers-reduced-motion:reduce){.river-hero .rnode.active .halo{animation:none}}
.river-hero .rnode .ring{fill:#052749;stroke:rgba(181,212,244,.5);stroke-width:1.8;transition:.35s var(--ease)}
.river-hero .rnode .rnum{font-family:var(--serif);font-size:14px;font-weight:600;fill:#8FB4D9;transition:.3s}
.river-hero .rnode text:not(.rnum){font-family:var(--sans);font-size:22px;font-weight:600;fill:#C4D8ED;letter-spacing:.04em;transition:.3s}
.river-hero .rnode:hover text:not(.rnum){fill:#fff}
.river-hero .rnode.active .ring{stroke:#57BE96;fill:#0B4437}
.river-hero .rnode.active .rnum{fill:#9FE0C6}
.river-hero .rnode.active text:not(.rnum){fill:#fff}
.river-hero .rnode.passed .ring{stroke:#378ADD}
.river-hero .rnode.passed .rnum{fill:#7FB6EA}

.river-hero .river-card{position:relative;width:min(880px,94vw);margin:.5rem auto 0;padding:1.05rem 1.7rem;background:rgba(6,34,63,.52);border:1px solid rgba(143,216,188,.3);border-radius:18px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 30px 64px -30px rgba(0,0,0,.7);z-index:5;text-align:left}
.river-hero .rc-in{display:flex;align-items:center;gap:2rem}
.river-hero .rc-l{flex:0 0 220px}
.river-hero .rc-r{flex:1;min-width:0}
@media (max-width:700px){.river-hero .rc-in{flex-direction:column;align-items:flex-start;gap:.6rem}.river-hero .rc-l{flex:none}}
.river-hero .river-card .rc-k{font-size:.66rem;letter-spacing:.24em;color:#8FD8BC}
.river-hero .river-card h3{color:#fff;font-size:1.4rem;margin:.3rem 0 0}
.river-hero .river-card p{font-size:1.06rem;color:#C8DDF2;line-height:1.6;margin:0}
.river-hero .river-card .rc-next{display:block;margin-top:.5rem;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:#6E9FCB;font-weight:600}
.river-hero .river-card.swap .rc-in{opacity:0}
.river-hero .rc-in{transition:opacity .25s var(--ease)}
@media (max-width:820px){
  .river-hero{min-height:0;padding-top:6rem}
  .river-hero .river-svg,.river-hero .river-card{display:none}
  .river-hero .river-mobile{display:block;width:min(92vw,560px);margin-inline:auto}
}


/* ============ Metro polish v10 — visual elevation only ============ */
.m-map defs, .m-map svg{overflow:visible}
.m-map .track{stroke-width:4}
.m-map .flow{stroke-width:2.5;opacity:.55;stroke-dasharray:1.5 12}
.m-map .st .ring{stroke-width:1.6;filter:drop-shadow(0 1px 2px rgba(4,44,83,.08))}
.m-map .st:hover .ring{stroke:color-mix(in srgb,var(--pc,#185FA5) 55%,transparent);filter:drop-shadow(0 4px 10px color-mix(in srgb,var(--pc,#185FA5) 25%,transparent))}
.m-map .st:hover .ico{stroke:var(--channel-dark)}
.m-map .st:hover .slbl{fill:var(--channel-dark)}
.m-map .st.on .ring{filter:drop-shadow(0 6px 18px color-mix(in srgb,var(--pc,#185FA5) 55%,transparent))}
.m-map .st.on .node{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--pc,#185FA5) 70%,transparent))}
.m-map .st .ring,.m-map .st .node,.m-map .st .ico,.m-map .st .snum,.m-map .st .slbl{transition-duration:.5s;transition-timing-function:cubic-bezier(.22,.61,.2,1)}
.m-map .st .ico{transform-origin:center;transform-box:fill-box}
.m-map .st.on .ico{transform:scale(1.06)}
.m-map .st .slbl{font-weight:600}
.m-map .st.on .slbl{font-weight:700}

/* Panel: staggered fade */
.m-panel .mp-in > *{opacity:1;transform:none;transition:opacity .38s var(--ease),transform .38s var(--ease)}
.m-panel.swap .mp-in > *{opacity:0}
.m-panel.swap .mp-k{transform:translateY(6px)}
.m-panel.swap h3{transform:translateY(8px);transition-delay:40ms}
.m-panel.swap .mp-d{transform:translateY(10px);transition-delay:80ms}
.m-panel .mp-in .mp-k{transition-delay:.05s}
.m-panel .mp-in h3{transition-delay:.12s}
.m-panel .mp-in .mp-d{transition-delay:.19s}

/* Progress bar refinement */
.m-progress{height:2px;background:color-mix(in srgb,var(--pc,#185FA5) 10%,transparent)}
.m-progress i{background:linear-gradient(90deg,var(--pc,#185FA5),color-mix(in srgb,var(--pc,#185FA5) 60%,#57BE96))}

/* ============ v10: leadership profile overlay (Tata Electronics-style, Revera palette) ============ */
#folio-drawer{position:fixed;inset:0;z-index:220;max-height:none;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:clamp(.9rem,3vw,2.4rem);pointer-events:none;visibility:hidden;transition:visibility 0s .55s}
#folio-drawer.open{pointer-events:auto;visibility:visible;transition:visibility 0s 0s}
#folio-drawer::before{content:"";position:absolute;inset:0;background:rgba(3,20,38,.82);opacity:0;transition:opacity .5s var(--ease)}
#folio-drawer.open::before{opacity:1}
#folio-drawer .fd-in.fd-rich{position:relative;display:flex;flex-direction:row;align-items:stretch;gap:clamp(1.6rem,3.4vw,3.2rem);width:min(1240px,100%);max-height:min(880px,92vh);padding:clamp(1.5rem,3.4vw,3rem);border:0;border-left:0;border-radius:26px;background:var(--grad-deep);box-shadow:0 60px 140px -50px rgba(0,0,0,.85);opacity:0;transform:translateY(30px) scale(.96);transition:opacity .55s var(--ease),transform .55s var(--ease)}
#folio-drawer.open .fd-in.fd-rich{opacity:1;transform:none}
#folio-drawer .fd-in.fd-rich::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(55,138,221,.85),rgba(29,158,117,.75));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
#folio-drawer.swapping .fd-in.fd-rich{opacity:0;transform:translateY(14px) scale(.99)}
#folio-drawer .fd-in.fd-rich .fd-close{position:absolute;top:1.25rem;right:1.25rem;z-index:2;width:48px;height:48px;border-radius:50%;border:1.5px solid rgba(255,255,255,.6);background:none;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .3s,border-color .3s,color .3s}
#folio-drawer .fd-in.fd-rich .fd-close svg{width:20px;height:20px}
#folio-drawer .fd-in.fd-rich .fd-close:hover{background:rgba(255,255,255,.14);border-color:#fff}
#folio-drawer .fd-in.fd-rich .fdp-photo{flex:0 0 clamp(250px,34%,430px);align-self:flex-start;width:auto;height:auto;aspect-ratio:640/680;border-radius:16px;overflow:hidden;border:0;box-shadow:none;max-height:100%}
#folio-drawer .fd-in.fd-rich .fdp-photo img{width:100%;height:100%;object-fit:cover;display:block}
#folio-drawer .fd-in.fd-rich .fdp-body{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;padding-right:clamp(0rem,2vw,1.6rem)}
#folio-drawer .fd-in.fd-rich h3{font-family:var(--sans);font-weight:600;font-size:clamp(1.6rem,2.3vw,2.05rem);line-height:1.2;color:#fff;margin:0;padding-right:3.4rem}
#folio-drawer .fd-in.fd-rich .role{font-family:var(--sans);font-size:clamp(1.02rem,1.3vw,1.2rem);font-weight:400;letter-spacing:0;text-transform:none;color:#9FB6CE;margin:.55rem 0 1.9rem}
#folio-drawer .fd-in.fd-rich .fdp-text{overflow-y:auto;padding-right:1.1rem;scrollbar-width:thin;scrollbar-color:rgba(181,212,244,.4) rgba(255,255,255,.06)}
#folio-drawer .fd-in.fd-rich .fdp-text::-webkit-scrollbar{width:6px}
#folio-drawer .fd-in.fd-rich .fdp-text::-webkit-scrollbar-track{background:rgba(255,255,255,.06);border-radius:3px}
#folio-drawer .fd-in.fd-rich .fdp-text::-webkit-scrollbar-thumb{background:rgba(181,212,244,.4);border-radius:3px}
#folio-drawer .fd-in.fd-rich .fdp-text p{font-family:var(--sans);font-size:clamp(1rem,1.2vw,1.12rem);line-height:1.75;color:#CBDAEC;margin:0 0 1.35rem;max-width:none}
#folio-drawer .fd-in.fd-rich .fdp-text p:last-child{margin-bottom:.2rem}
body.profile-open{overflow:hidden}
@media (max-width:840px){
  #folio-drawer .fd-in.fd-rich{flex-direction:column;gap:1.3rem;max-height:94vh;padding:1.3rem 1.2rem 1.5rem}
  #folio-drawer .fd-in.fd-rich .fdp-photo{flex:none;width:min(230px,58%);aspect-ratio:1/1;border-radius:14px}
  #folio-drawer .fd-in.fd-rich .fdp-body{flex:1;overflow:hidden}
  #folio-drawer .fd-in.fd-rich h3{padding-right:3.2rem}
  #folio-drawer .fd-in.fd-rich .fd-close{top:1rem;right:1rem;width:42px;height:42px}
}

/* v15: hide mobile popup by default (only shows in mobile media query) */
.rm-popup{display:none}

/* ============ v15: mobile river — animation, centered line, popup ============ */
@media (max-width:820px) {
  /* Perfectly centered connecting line: dot center = left:18px (padding-left:36px, dot 36px wide centered) */
  .river-mobile {
    padding-left: 0;
    list-style: none;
    position: relative;
    margin-top: 1.2rem;
  }
  /* Vertical line through dot centers */
  .river-mobile::before {
    content: "";
    position: absolute;
    left: 17px;
    top: 18px;
    bottom: 18px;
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(180deg, rgba(55,138,221,.4), rgba(29,158,117,.4));
    z-index: 0;
  }
  /* Flowing comet: bright dot travels down the line */
  .river-mobile::after {
    content: "";
    position: absolute;
    left: 14px;
    top: 0;
    width: 8px;
    height: 50px;
    border-radius: 8px;
    background: linear-gradient(180deg, transparent, #8FD8BC, transparent);
    box-shadow: 0 0 14px rgba(143,216,188,.7);
    animation: river-mobile-comet 3s linear infinite;
    z-index: 2;
    pointer-events: none;
  }
  @keyframes river-mobile-comet {
    0%   { transform: translateY(0); opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { transform: translateY(700px); opacity: 0; }
  }
  /* Each stage row */
  .river-mobile li {
    position: relative;
    padding: 0 1rem 2rem 52px; /* 52px = 18px center + 16px gap */
    cursor: pointer;
    transition: opacity .3s;
  }
  .river-mobile li:last-child { padding-bottom: .5rem; }
  /* Dot: 20px diameter, centered at left:8px so center = left:18px */
  .river-mobile li::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #04223F;
    border: 2.5px solid #57BE96;
    transition: background .35s, border-color .35s, box-shadow .35s;
    z-index: 1;
  }
  /* Active dot */
  .river-mobile li.rm-active::before {
    background: #57BE96;
    border-color: #9FE0C6;
    box-shadow: 0 0 0 6px rgba(87,190,150,.18);
  }
  /* Passed dot */
  .river-mobile li.rm-passed::before {
    background: #378ADD;
    border-color: #7FB6EA;
  }
  .river-mobile h3 {
    color: #fff;
    font-size: 1.08rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.3;
  }
  .river-mobile li.rm-active h3 { color: #9FE0C6; }
  /* Hide static paragraph text — popup handles content display */
  .river-mobile p { display: none; }

  /* Mobile river popup */
  .rm-popup {
    display: block;
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: calc(1.5rem + env(safe-area-inset-bottom));
    z-index: 150;
    background: rgba(6,34,63,.95);
    border: 1px solid rgba(143,216,188,.3);
    border-radius: 16px;
    padding: 1.1rem 1.3rem;
    box-shadow: 0 20px 60px -20px rgba(0,0,0,.8);
    pointer-events: none;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .35s var(--ease), transform .35s var(--ease);
  }
  .rm-popup.rm-visible {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .rm-popup .rc-k {
    font-size: .66rem;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: #8FD8BC;
    font-weight: 600;
    display: block;
    margin-bottom: .35rem;
  }
  .rm-popup h3 {
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 .4rem;
  }
  .rm-popup p {
    font-size: .9rem;
    color: #CFE2F5;
    line-height: 1.6;
    margin: 0;
  }
}

/* ============ v15: mobile profile popup — clean single block ============ */
@media (max-width:768px) {
  #folio-drawer { padding: .5rem; }
  /* Panel: fixed height, hidden overflow, so border ::before stays put */
  #folio-drawer .fd-in.fd-rich {
    flex-direction: column;
    align-items: stretch;
    gap: .9rem;
    padding: 1.3rem 1.1rem 1.4rem;
    width: 100%;
    max-width: 100%;
    height: 92vh;
    max-height: 92vh;
    overflow: hidden;
  }
  /* Photo: smaller square on top, does not shrink */
  #folio-drawer .fd-in.fd-rich .fdp-photo {
    flex: 0 0 auto;
    width: 130px;
    height: 130px;
    aspect-ratio: 1 / 1;
    border-radius: 14px;
    align-self: center;
    margin-top: .3rem;
  }
  /* Body takes remaining vertical space and scrolls INSIDE the panel */
  #folio-drawer .fd-in.fd-rich .fdp-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding-right: 0;
    width: 100%;
  }
  #folio-drawer .fd-in.fd-rich h3 {
    font-size: 1.35rem;
    padding-right: 3rem;
    line-height: 1.25;
  }
  #folio-drawer .fd-in.fd-rich .role {
    font-size: .95rem;
    margin: .4rem 0 1rem;
  }
  #folio-drawer .fd-in.fd-rich .fdp-text {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: .5rem;
  }
  #folio-drawer .fd-in.fd-rich .fdp-text p {
    font-size: .95rem;
    line-height: 1.65;
    margin-bottom: 1rem;
  }
  #folio-drawer .fd-in.fd-rich .fd-close {
    width: 40px;
    height: 40px;
    top: .8rem;
    right: .8rem;
    border-width: 1.5px;
  }
}