/* One continuous atmosphere below the Hero; financial artwork stays in #home.
   Tokens are scoped here so the Hero, navigation and profile card stay intact. */
.portfolio-v2 .portfolio-continuum {
  --color-text-light: #ede7da;
  --color-text-muted: #b7c2ce;
  --color-card-bg: #101f31;
  --card-bg: #101f31;
  --card-border: rgba(151, 174, 198, .19);
  --v2-line: rgba(223, 190, 131, .2);
  position: relative;
  isolation: isolate;
  color: #ede7da;
  background-image:
    linear-gradient(rgba(156, 177, 199, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(156, 177, 199, .055) 1px, transparent 1px),
    radial-gradient(ellipse 85% 780px at 0% 0%, rgba(35, 77, 119, .17), transparent 75%),
    radial-gradient(ellipse 65% 850px at 100% 15%, rgba(196, 152, 79, .065), transparent 75%),
    radial-gradient(ellipse 85% 1050px at 0% 34%, rgba(35, 77, 119, .22), transparent 75%),
    radial-gradient(ellipse 65% 1100px at 100% 53%, rgba(196, 152, 79, .055), transparent 75%),
    radial-gradient(ellipse 90% 1300px at 10% 76%, rgba(35, 77, 119, .2), transparent 75%),
    radial-gradient(ellipse 70% 800px at 95% 100%, rgba(196, 152, 79, .08), transparent 75%),
    linear-gradient(100deg, #0b192a, #101b2b);
  background-size: 64px 64px, 64px 64px, auto, auto, auto, auto, auto, auto, auto;
  background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
}

/* Transparent sections share the same light field, without alternating bands. */
.portfolio-v2 .portfolio-continuum > section,
.portfolio-v2 .portfolio-continuum > .footer,
.portfolio-v2 .portfolio-continuum .achievements-frame {
  background: transparent;
}
.portfolio-v2 .portfolio-continuum .trust-strip {
  border-color: rgba(223, 190, 131, .12);
  box-shadow: none;
}
.portfolio-v2 .portfolio-continuum .section-heading { color: #f7f3ea; }
.portfolio-v2 .portfolio-continuum .section-index { color: #b7c2ce; }
.portfolio-v2 .portfolio-continuum .section-index span { color: #dfbe83 !important; }
.portfolio-v2 .portfolio-continuum .experience-section .section-index > span:first-child {
  background: rgba(196, 152, 79, .14);
  box-shadow: 0 8px 20px rgba(3, 9, 17, .18);
}
.portfolio-v2 .portfolio-continuum .experience-section .section-index:after {
  background: linear-gradient(90deg, rgba(223, 190, 131, .4), transparent);
}
html[dir="rtl"] .portfolio-v2 .portfolio-continuum .experience-section .section-index:after {
  background: linear-gradient(270deg, rgba(223, 190, 131, .4), transparent);
}

/* Translucent navy surfaces retain depth without becoming bright rectangles. */
.portfolio-v2 .portfolio-continuum :is(.about-info-box, .timeline-content-card, .skills-card, .cert-card, .info-card, .linkedin-qr-card, .bank-card) {
  background: linear-gradient(135deg, rgba(27, 47, 69, .8), rgba(11, 25, 42, .9)) !important;
  border-color: rgba(151, 174, 198, .2) !important;
  box-shadow: 0 18px 42px rgba(3, 9, 17, .18), inset 0 1px 0 rgba(223, 190, 131, .04) !important;
}
.portfolio-v2 .portfolio-continuum :is(.about-info-box, .timeline-content-card, .skills-card, .cert-card, .bank-card):hover {
  border-color: rgba(223, 190, 131, .48) !important;
  box-shadow: 0 22px 46px rgba(3, 9, 17, .24) !important;
}
.portfolio-v2 .portfolio-continuum :is(.about-info-box h3, .card-role, .skills-card-title, .cert-title, .banking-heading h3, .bank-card h4) {
  color: #f7f3ea !important;
}
.portfolio-v2 .portfolio-continuum :is(.about-info-box p, .card-company, .card-bullets, .cert-desc, .banking-heading p, .stat-label, .bank-card > div:last-child span) {
  color: #b7c2ce;
}
.portfolio-v2 .portfolio-continuum :is(.about-info-box p, .card-bullets, .cert-desc, .banking-heading p) {
  font-size: 16px;
  line-height: 1.8;
}
.portfolio-v2 .portfolio-continuum :is(.stat-number, .card-date, .cert-year) { color: #dfbe83 !important; }
.portfolio-v2 .portfolio-continuum :is(.cert-org, .banking-heading > span, .eqrar-supporting h4, .eqrar-complete-file) { color: #dfbe83; }
.portfolio-v2 .portfolio-continuum :is(.info-stats, .skills-card-title, .eqrar-supporting) { border-color: rgba(223, 190, 131, .17); }
.portfolio-v2 .portfolio-continuum .bpkh-about {
  background: rgba(196, 152, 79, .07);
  color: #d2d8df !important;
}
.portfolio-v2 .portfolio-continuum .timeline-line { background: rgba(223, 190, 131, .25); }
.portfolio-v2 .portfolio-continuum .timeline-node:after { background: #101b2b; border-color: #c4984f; }
.portfolio-v2 .portfolio-continuum .card-bullets li:before { color: #dfbe83; }
.portfolio-v2 .portfolio-continuum :is(.badge-tag, .progression-bar .badge) {
  background: rgba(151, 174, 198, .08);
  border-color: rgba(151, 174, 198, .2);
  color: #d2d8df;
}
.portfolio-v2 .portfolio-continuum :is(.badge-tag:hover, .progression-bar .active-badge) {
  background: rgba(196, 152, 79, .17);
  border-color: rgba(223, 190, 131, .4);
  color: #dfbe83;
}
.portfolio-v2 .portfolio-continuum .badge-tag { font-size: 14px; }

/* Original logos and certificate artwork keep neutral, readable backplates. */
.portfolio-v2 .portfolio-continuum .erp-logo-card { background: #f7f3ea; }
.portfolio-v2 .portfolio-continuum .experience-company-logo {
  background: #f7f3ea;
  padding: 8px;
  border-radius: 8px;
}
.portfolio-v2 .portfolio-continuum .certificate-number { border-color: #15263a; color: #dfbe83; }
.portfolio-v2 .portfolio-continuum .cert-placeholder { background: rgba(35, 77, 119, .15); color: #dfbe83; }
.portfolio-v2 .portfolio-continuum .cert-view-link { color: #dfbe83; }
.portfolio-v2 .portfolio-continuum .cert-view-link:hover { color: #0b1220; }
.portfolio-v2 .portfolio-continuum .contact-action { color: #ede7da; border-color: rgba(223, 190, 131, .48); }
.portfolio-v2 .portfolio-continuum .contact-action:hover { background: #24384f; }
.portfolio-v2 .portfolio-continuum .contact-action.primary { color: #0b1220; background: #c4984f; }
.portfolio-v2 .portfolio-continuum .contact-info-wrapper :is(h4, strong) { color: #dfbe83; }
.portfolio-v2 .portfolio-continuum .contact-info-wrapper :is(p, a) { color: #d2d8df; }
.portfolio-v2 .portfolio-continuum .contact-info-wrapper a:hover { color: #dfbe83; }
.portfolio-v2 .portfolio-continuum .footer { border-color: rgba(223, 190, 131, .14); }
.portfolio-v2 .portfolio-continuum :is(a, button):focus-visible { outline: 2px solid #dfbe83; outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) {
  .portfolio-continuum .scroll-reveal { opacity: 1; transform: none; transition: none; }
}