/* Final visual balancing layer: softer periwinkle, cleaner surfaces, calmer contrast. */
:root {
  --brand-periwinkle: #8f96ff;
  --brand-periwinkle-soft: #f0f2ff;
  --brand-periwinkle-pale: #f7f8ff;
  --brand-periwinkle-dark: #5159c9;
  --brand-brown: #4a2418;
  --brand-dark: #201714;
  --brand-ink: #231f1c;
  --brand-muted: #6f625b;
  --brand-line: rgba(143, 150, 255, .16);
  --first-color: #8f96ff;
  --second-color: #201714;
  --shadow-soft: 0 18px 48px rgba(34, 24, 18, .08);
  --shadow-strong: 0 24px 70px rgba(34, 24, 18, .13);
  --brand-card: #ffffff;
  --brand-soft-bg: #f7f8ff;
}

html { scroll-behavior: smooth; }
* { scrollbar-color: var(--brand-periwinkle) #f0f2ff; }

body.portfolio-page,
body.dynamic-portfolio-page {
  background:
    radial-gradient(circle at 12% 6%, rgba(143, 150, 255, .075), transparent 24rem),
    radial-gradient(circle at 90% 12%, rgba(143, 150, 255, .055), transparent 22rem),
    linear-gradient(180deg, #fffdfb 0%, #ffffff 42%, #fbfbff 100%) !important;
  color: var(--brand-ink) !important;
}

body.portfolio-page::before {
  opacity: .22 !important;
  background-image:
    linear-gradient(rgba(143,150,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(143,150,255,.028) 1px, transparent 1px) !important;
}

.scroll-progress span {
  background: linear-gradient(90deg, #5159c9, var(--brand-periwinkle)) !important;
  box-shadow: none !important;
}

.l-header {
  background: rgba(255,255,255,.88) !important;
  border-bottom: 1px solid rgba(143,150,255,.10) !important;
  box-shadow: 0 10px 34px rgba(34,24,18,.055) !important;
}
.nav__link::after,
.active::after {
  background: var(--brand-periwinkle) !important;
}
.nav__link--cta {
  background: var(--brand-periwinkle) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(143,150,255,.16) !important;
}
.nav__link--cta:hover { background: var(--brand-periwinkle-dark) !important; color:#fff !important; }

.home__title-color {
  background: linear-gradient(110deg, #5159c9 0%, var(--brand-periwinkle) 72%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}
.hero__eyebrow,
.hero__metrics div,
.hero-orbit-card,
.home__social-icon,
.cms-card,
.service-card,
.case-card,
.project-card,
.publication-card,
.impact-card,
.tech-stack-card,
.taught-card,
.testimonial-card,
.innovation-card,
.resource-card,
.faq-card,
.academy-course-card,
.lesson-card,
.community-event-card {
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(143,150,255,.105) !important;
  box-shadow: 0 14px 34px rgba(34,24,18,.065) !important;
}

.cms-card:hover,
.service-card:hover,
.case-card:hover,
.project-card:hover,
.publication-card:hover,
.impact-card:hover,
.tech-stack-card:hover,
.taught-card:hover,
.testimonial-card:hover,
.innovation-card:hover,
.resource-card:hover,
.faq-card:hover,
.academy-course-card:hover,
.lesson-card:hover,
.community-event-card:hover {
  border-color: rgba(143,150,255,.24) !important;
  box-shadow: 0 20px 48px rgba(34,24,18,.095) !important;
  transform: translateY(-4px);
}

.button,
.contact__button,
.join-button,
.subscribe__button,
.pricing__card button,
.button--primary,
.project-filter.active,
.project-filter:hover,
.case-card__industry,
.process-card span,
.lesson-card>span {
  background: var(--brand-periwinkle) !important;
  color: #fff !important;
  border-color: var(--brand-periwinkle) !important;
  box-shadow: 0 12px 24px rgba(143,150,255,.18) !important;
}
.button:hover,
.contact__button:hover,
.join-button:hover,
.subscribe__button:hover,
.pricing__card button:hover,
.button--primary:hover {
  background: var(--brand-periwinkle-dark) !important;
  box-shadow: 0 16px 34px rgba(159,63,20,.20) !important;
  filter: none !important;
}
.button--ghost,
.project-filter,
.blog__read-more,
.publication-inline-link {
  background: #fff !important;
  color: var(--brand-periwinkle-dark) !important;
  border: 1px solid rgba(143,150,255,.20) !important;
  box-shadow: 0 10px 22px rgba(34,24,18,.045) !important;
}
.button--ghost:hover,
.project-filter:hover { background: var(--brand-periwinkle-soft) !important; }

.section-title,
.home__title,
.cms-card h3,
.cms-card h4,
.case-card h3,
.project-card h3,
.publication-card h3,
.faq-card summary,
.page-hero h1,
.article-hero h1,
.publication-detail__content h1 {
  color: var(--brand-dark) !important;
}
.section-kicker,
.hero__summary,
.cms-card p,
.service-card p,
.case-card p,
.project-card p,
.publication-card p,
.innovation-card p,
.resource-card p,
.faq-card p,
.page-hero p {
  color: var(--brand-muted) !important;
}

.home__blob path { fill: #8f96ff !important; }
.skills__icon,
.skills__core-card i,
.service-card i,
.why-work-grid i,
.innovation-card i,
.resource-card i,
.contact__info-item i,
.hero-orbit-card i,
.academy-feature-grid i,
.community-benefits-grid i {
  color: var(--brand-periwinkle) !important;
}
.skills__core-number,
.tag-cloud span,
.content-chip,
.academy-course-card__body span,
.mini-label,
.resource-card span,
.course-meta span,
.project-card__body>span,
.publication-card span,
.testimonial-card span,
.community-event-card span {
  background: var(--brand-periwinkle-soft) !important;
  color: var(--brand-periwinkle-dark) !important;
  border-color: rgba(143,150,255,.16) !important;
}

.skills__bar,
.timeline:before,
.timeline li .timeline-badge,
.section-title::after,
.hero-highlight__icon,
.client-card__icon {
  background: var(--brand-periwinkle) !important;
  box-shadow: 0 12px 24px rgba(143,150,255,.13) !important;
}
.timeline li .timeline-panel {
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(143,150,255,.10) !important;
}

.page-hero__inner,
.dynamic-profile-frame,
.dynamic-about,
.skills__intro-panel,
.external-source-callout,
.project-card__image,
.publication-card img,
.academy-course-card__image,
.media-file-icon {
  background: linear-gradient(135deg, #fbfbff 0%, #ffffff 68%) !important;
  border-color: rgba(143,150,255,.10) !important;
}

.portfolio-cta {
  background: linear-gradient(135deg, #fff6ef, #ffffff) !important;
  color: var(--brand-ink) !important;
  border: 1px solid rgba(143,150,255,.15) !important;
  border-left: 7px solid var(--brand-periwinkle) !important;
  box-shadow: 0 18px 46px rgba(34,24,18,.07) !important;
}
.portfolio-cta h2 { color: var(--brand-dark) !important; }
.portfolio-cta p { color: var(--brand-muted) !important; }
.portfolio-cta__button,
.portfolio-cta .button { background: var(--brand-periwinkle) !important; color: #fff !important; }

.contact__intro {
  background: linear-gradient(135deg, #f0f2ff 0%, #ffffff 100%) !important;
  color: var(--brand-ink) !important;
  border: 1px solid rgba(143,150,255,.15) !important;
  box-shadow: 0 16px 42px rgba(34,24,18,.06) !important;
}
.contact__intro h3 { color: var(--brand-dark) !important; }
.contact__intro p,
.contact__availability-strip { color: var(--brand-muted) !important; }
.contact__eyebrow,
.contact__quick-card,
.contact__availability-strip {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(143,150,255,.14) !important;
  color: var(--brand-ink) !important;
}
.contact__quick-card strong { color: var(--brand-dark) !important; }
.contact__quick-card span { color: var(--brand-muted) !important; }
.contact__quick-card i { background: var(--brand-periwinkle-soft) !important; color: var(--brand-periwinkle-dark) !important; }
.contact__panel,
.contact-panel,
.contact__form {
  background: #fff !important;
  border: 1px solid rgba(143,150,255,.10) !important;
  box-shadow: 0 14px 34px rgba(34,24,18,.065) !important;
}
.contact__input,
.newsletter-form input,
.contact__select,
.admin-form.mini-form select,
.admin-form.mini-form textarea {
  border-color: rgba(45,38,33,.16) !important;
  color: var(--brand-ink) !important;
  background: #fff !important;
}
.contact__input:focus,
.newsletter-form input:focus,
.contact__select:focus,
.contact__textarea:focus {
  border-color: rgba(143,150,255,.42) !important;
  box-shadow: 0 0 0 4px rgba(143,150,255,.09) !important;
}

.footer {
  background: #201714 !important;
  color: rgba(255,255,255,.88) !important;
  border-top: 4px solid var(--brand-periwinkle) !important;
}
.footer::before,
.footer::after { opacity: .12 !important; }
.footer__quicklinks a,
.footer__copy,
.footer p { color: rgba(255,255,255,.72) !important; }
.footer__icon:hover,
.footer__quicklinks a:hover { color: #b7bdff !important; }

.site-loader {
  background: linear-gradient(135deg, #fbfbff, #fff) !important;
}
.site-loader__ring { border-top-color: var(--brand-periwinkle) !important; border-left-color: rgba(143,150,255,.18) !important; }

.hero__ambient,
.hero-highlight::before,
.about__visual::before,
.case-card::before,
.client-card::before,
.innovation-card::before,
.publication-snippet-card::before,
.contact__intro::after,
.portfolio-cta::before,
.portfolio-cta::after {
  opacity: .28 !important;
}

.cookie-consent,
.cookie-modal__panel {
  border-color: rgba(143,150,255,.16) !important;
  box-shadow: 0 18px 52px rgba(34,24,18,.10) !important;
}
.cookie-consent__button--primary,
.cookie-modal__save { background: var(--brand-periwinkle) !important; }
.cookie-consent__button--primary:hover,
.cookie-modal__save:hover { background: var(--brand-periwinkle-dark) !important; }

@media (max-width: 768px) {
  .portfolio-cta { border-left-width: 0 !important; border-top: 6px solid var(--brand-periwinkle) !important; }
  .contact__intro { padding: 1.15rem !important; }
}