/*
 * Theme overrides are loaded after page styles so one shared file can switch
 * every v2 page without duplicating light-mode rules in each page stylesheet.
 */

.theme-toggle {
  position: fixed;
  right: clamp(0.75rem, 2vw, 1.5rem);
  bottom: clamp(0.75rem, 2vw, 1.5rem);
  z-index: 30;
  display: inline-grid;
  width: 2.75rem;
  height: 2.75rem;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: color-mix(in srgb, var(--color-surface-raised) 92%, transparent);
  box-shadow: 0 0.75rem 2rem rgb(0 0 0 / 24%);
  color: var(--color-text);
  cursor: pointer;
  backdrop-filter: blur(0.5rem);
}

.theme-toggle:hover {
  border-color: var(--color-purple-400);
  background: var(--color-surface-soft);
}

.theme-toggle__icon {
  font-size: 1.05rem;
  line-height: 1;
}

html[data-theme="light"] {
  color-scheme: light;

  --color-teal-400: #08736d;
  --color-teal-500: #09635f;
  --color-orange-400: #a83e00;
  --color-orange-500: #d65308;
  --color-purple-400: #5944ae;
  --color-purple-500: #7359d8;
  --color-blue-400: #1763a8;
  --color-blue-500: #287bc9;
  --color-success: #176a42;
  --color-warning: #805307;
  --color-danger: #a52c34;

  --color-background: #edf3f5;
  --color-surface: #ffffff;
  --color-surface-raised: #f7f9fb;
  --color-surface-soft: #e1e8ed;
  --color-border: #9daeb7;
  --color-border-soft: rgb(25 35 41 / 13%);
  --color-text: #182025;
  --color-text-muted: #4a5860;
  --color-focus: #075f5b;
  --shadow-raised: 0 1.25rem 3rem rgb(35 48 55 / 14%);
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at 8% 0%, rgb(0 156 145 / 16%), transparent 34rem),
    radial-gradient(circle at 95% 5%, rgb(239 97 18 / 15%), transparent 32rem),
    var(--color-background);
}

html[data-theme="light"] .site-header {
  background: rgb(247 249 250 / 96%);
}

html[data-theme="light"] .site-header--enhanced {
  background: transparent;
}

html[data-theme="light"] .site-header--enhanced .site-header__island {
  border-color: rgb(128 142 150 / var(--header-border-alpha));
  background: rgb(250 251 252 / var(--header-background-alpha));
}

html[data-theme="light"] .site-nav a:hover,
html[data-theme="light"] .site-nav a[aria-current="page"] {
  border-color: rgb(8 116 111 / 32%);
  background: rgb(8 116 111 / 9%);
}

html[data-theme="light"] .eyebrow {
  border-color: rgb(185 74 8 / 30%);
  background: rgb(185 74 8 / 8%);
  color: #8f3704;
}

html[data-theme="light"] .eyebrow--teal {
  border-color: rgb(8 116 111 / 30%);
  background: rgb(8 116 111 / 8%);
  color: #075e5a;
}

html[data-theme="light"] .button--secondary {
  background: rgb(255 255 255 / 72%);
}

html[data-theme="light"] .form-field input,
html[data-theme="light"] .form-field select,
html[data-theme="light"] .form-field textarea {
  background: rgb(255 255 255 / 90%);
}

html[data-theme="light"] .contact-form {
  background: rgb(255 255 255 / 88%);
}

html[data-theme="light"] .contact-section {
  background:
    radial-gradient(circle at 5% 10%, rgb(195 77 9 / 13%), transparent 24rem),
    radial-gradient(circle at 95% 90%, rgb(105 82 196 / 12%), transparent 26rem),
    #e9edf0;
}

html[data-theme="light"] .home-hero,
html[data-theme="light"] .public-hero,
html[data-theme="light"] .about-story,
html[data-theme="light"] .network-options {
  background:
    linear-gradient(rgb(20 31 37 / 4%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(20 31 37 / 4%) 1px, transparent 1px),
    radial-gradient(circle at 86% 18%, rgb(105 82 196 / 15%), transparent 26rem),
    radial-gradient(circle at 10% 80%, rgb(11 94 91 / 14%), transparent 28rem),
    #f4f6f7;
  background-size: 4rem 4rem, 4rem 4rem, auto, auto, auto;
}

html[data-theme="light"] .home-hero__signal {
  color: rgb(21 27 31 / 48%);
}

html[data-theme="light"] .home-hero__signal span {
  border-top-color: rgb(21 27 31 / 14%);
}

html[data-theme="light"] .services-overview,
html[data-theme="light"] .service-page-nav,
html[data-theme="light"] .service-section,
html[data-theme="light"] .service-section--addons,
html[data-theme="light"] .about-experience {
  background: hsl(0, 0%, 100%);
}

html[data-theme="light"] .service-path {
  background: rgb(248 250 251 / 90%);
}

html[data-theme="light"] .service-details,
html[data-theme="light"] .about-founders,
html[data-theme="light"] .availability-section,
html[data-theme="light"] .partner-workspace,
html[data-theme="light"] .join-section,
html[data-theme="light"] .associate-login-page,
html[data-theme="light"] .profile-page {
  background:
    radial-gradient(circle at 92% 10%, rgb(20 125 121 / 7%), transparent 28rem),
    var(--color-background);
}

html[data-theme="light"] .partner-access {
  background:
    radial-gradient(circle at 90% 10%, rgb(20 125 121 / 9%), transparent 28rem),
    var(--color-background);
}

html[data-theme="light"] .join-section {
  background:
    radial-gradient(circle at 5% 10%, rgb(244 106 18 / 9%), transparent 28rem),
    var(--color-background);
}

html[data-theme="light"] .access-gate,
html[data-theme="light"] .workspace-panel,
html[data-theme="light"] .join-form,
html[data-theme="light"] .login-card,
html[data-theme="light"] .event-summary,
html[data-theme="light"] .mobile-selection-bar {
  background: rgb(255 255 255 / 96%);
}

html[data-theme="light"] .join-form {
  border-color: color-mix(in srgb, var(--color-orange-500) 22%, var(--color-border));
  background:
    linear-gradient(140deg, rgb(244 106 18 / 7%), transparent 48%),
    rgb(255 255 255 / 96%);
}

html[data-theme="light"] .planning-details,
html[data-theme="light"] .personnel-filters,
html[data-theme="light"] .selected-person,
html[data-theme="light"] .review-person,
html[data-theme="light"] .profile-role,
html[data-theme="light"] .join-role-grid label,
html[data-theme="light"] .join-acknowledgement {
  background: rgba(252, 252, 252, 0.78);
}

html[data-theme="light"] .profile-tools {
  background: #e2e7ea;
}

html[data-theme="light"] .profile-summary {
  background:
    linear-gradient(to bottom, var(--color-teal-400), var(--color-purple-500)) left / 0.22rem 100% no-repeat,
    linear-gradient(120deg, rgb(8 116 111 / 9%), transparent 45%),
    var(--color-surface);
}

html[data-theme="light"] .profile-avatar {
  color: #075e5a;
}

html[data-theme="light"] .field-log-page {
  background:
    radial-gradient(circle at 8% 0%, rgb(11 94 91 / 10%), transparent 30rem),
    radial-gradient(circle at 95% 5%, rgb(195 77 9 / 9%), transparent 28rem),
    var(--color-background);
}

html[data-theme="light"] .associate-events-page {
  background:
    radial-gradient(circle at 8% 0%, rgb(11 94 91 / 10%), transparent 30rem),
    radial-gradient(circle at 95% 5%, rgb(195 77 9 / 9%), transparent 28rem),
    var(--color-background);
}

html[data-theme="light"] .associate-events-hero {
  background:
    linear-gradient(135deg, rgb(11 94 91 / 14%), rgb(195 77 9 / 11%)),
    var(--color-surface-raised);
}

html[data-theme="light"] .associate-events-eyebrow,
html[data-theme="light"] .associate-events-count {
  color: #07504d;
}

html[data-theme="light"] .associate-events-step,
html[data-theme="light"] .opportunity-empty,
html[data-theme="light"] .opportunity-confirmation {
  background: rgb(25 35 41 / 4%);
}

html[data-theme="light"] .associate-events-field input,
html[data-theme="light"] .associate-events-field select,
html[data-theme="light"] .opportunity-event-card {
  background: var(--color-surface-soft);
}

html[data-theme="light"] .field-log-hero {
  background:
    linear-gradient(135deg, rgb(11 94 91 / 14%), rgb(195 77 9 / 11%)),
    var(--color-surface-raised);
}

html[data-theme="light"] .field-log-eyebrow,
html[data-theme="light"] .field-log-progress {
  color: #07504d;
}

html[data-theme="light"] .associate-tools-nav a,
html[data-theme="light"] .associate-tools-nav span,
html[data-theme="light"] .field-log-step {
  background: rgb(25 35 41 / 4%);
}

html[data-theme="light"] .field-log-form-field input,
html[data-theme="light"] .field-log-form-field select,
html[data-theme="light"] .field-log-form-field textarea,
html[data-theme="light"] .field-log-summary,
html[data-theme="light"] .field-log-button--secondary,
html[data-theme="light"] .field-log-confirmation__close {
  background: var(--color-surface-soft);
}

html[data-theme="light"] .associate-tools-footer a {
  color: #07504d;
}

html[data-theme="light"] .calendar-frame iframe {
  filter: none;
}

html[data-theme="light"] .personnel-card__initials,
html[data-theme="light"] .associate-card__initials {
  color: #4d379f;
}

html[data-theme="light"] .personnel-card__roles li,
html[data-theme="light"] .associate-card__roles li {
  color: #075e5a;
}

html[data-theme="light"] :is(
  .personnel-card__status--available,
  .profile-status,
  .personnel-card .button[data-selected="true"]
) {
  color: #17663f;
}

html[data-theme="light"] .personnel-card__status--unavailable {
  color: #9a2930;
}

/* Light-theme component polish. Keep colored identity accents while replacing
 * dark-only surfaces with readable, layered light surfaces. */
html[data-theme="light"] .site-account__menu {
  border-color: rgb(105 82 196 / 24%);
  background: linear-gradient(145deg, rgb(105 82 196 / 7%), transparent 70%), rgb(255 255 255 / 98%);
  box-shadow: 0 1rem 2.5rem rgb(35 48 55 / 18%);
}

html[data-theme="light"] .site-account__menu :is(a, button):hover {
  background: rgb(105 82 196 / 10%);
}

html[data-theme="light"] .services-overview__grid {
  background: rgb(83 99 108 / 22%);
}

html[data-theme="light"] .service-summary {
  background: linear-gradient(145deg, color-mix(in srgb, var(--service-accent) 9%, transparent), transparent 70%), #f9fafb;
}

html[data-theme="light"] .service-summary h3 { color: #182025; }
html[data-theme="light"] .service-summary p { color: #53626a; }

html[data-theme="light"] .network-composition {
  background:
    linear-gradient(rgb(20 31 37 / 4%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(20 31 37 / 4%) 1px, transparent 1px),
    radial-gradient(circle at 8% 48%, rgb(11 94 91 / 15%), transparent 30rem),
    radial-gradient(circle at 52% 25%, rgb(105 82 196 / 13%), transparent 28rem),
    radial-gradient(circle at 92% 62%, rgb(195 77 9 / 11%), transparent 27rem),
    #eef2f4;
  background-size: 5rem 5rem, 5rem 5rem, auto, auto, auto, auto;
}

html[data-theme="light"] .network-composition::after {
  background: linear-gradient(90deg, rgb(20 31 37 / 8%) 1px, transparent 1px);
}

html[data-theme="light"] .network-path-grid {
  border-color: rgb(83 99 108 / 22%);
  background: rgb(255 255 255 / 78%);
}

html[data-theme="light"] .network-path {
  background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--path-accent) 13%, transparent), transparent 18rem), rgb(255 255 255 / 58%);
}

html[data-theme="light"] .network-path:is(:hover, :focus-within) {
  background: radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--path-accent) 18%, transparent), transparent 18rem), rgb(255 255 255 / 86%);
}

html[data-theme="light"] .network-path:hover h2 {
  color: color-mix(in srgb, var(--path-accent) 82%, #182025);
}

html[data-theme="light"] .network-path__link {
  background: color-mix(in srgb, var(--path-accent) 10%, white);
}

html[data-theme="light"] .network-path:hover .network-path__link {
  background: color-mix(in srgb, var(--path-accent) 16%, white);
  color: color-mix(in srgb, var(--path-accent) 82%, #182025);
}

html[data-theme="light"] .access-gate {
  background: linear-gradient(140deg, rgb(11 94 91 / 9%), transparent 48%), rgb(255 255 255 / 96%);
}

html[data-theme="light"] :is(.event-summary, .mobile-selection-bar) {
  border-color: rgb(11 94 91 / 24%);
  background: linear-gradient(120deg, rgb(11 94 91 / 8%), transparent 55%), rgb(255 255 255 / 97%);
  box-shadow: 0 0.75rem 2rem rgb(35 48 55 / 14%);
}

html[data-theme="light"] .workspace-panel { background: rgb(255 255 255 / 92%); }

html[data-theme="light"] :is(.selected-person, .review-person, .profile-role) {
  background: rgb(25 35 41 / 4%);
}

html[data-theme="light"] .partner-page :is(.button--secondary, .workspace-steps button):hover:not(:disabled) {
  background-color: rgb(11 94 91 / 12%);
  color: #07504d;
}

html[data-theme="light"] .profile-tools {
  border-color: rgb(105 82 196 / 20%);
  background: linear-gradient(120deg, rgb(105 82 196 / 9%), transparent 52%), #e7ebee;
}

html[data-theme="light"] .profile-tool-link {
  border-color: rgb(105 82 196 / 26%);
  background: rgb(105 82 196 / 9%);
  color: #45358e;
}

html[data-theme="light"] .profile-tool-link:is(:hover, :focus-visible) {
  background: rgb(105 82 196 / 15%);
  color: #302267;
}

html[data-theme="light"] .profile-tool-link[aria-selected="true"] {
  border-bottom-color: #08736d;
  background: linear-gradient(0deg, rgb(8 115 109 / 24%), rgb(255 255 255 / 42%) 78%);
  color: #064f4b;
  font-weight: 800;
}

html[data-theme="light"] .profile-tool-link--signup[aria-selected="true"] {
  border-bottom-color: #5944ae;
  background: linear-gradient(0deg, rgb(89 68 174 / 23%), rgb(255 255 255 / 42%) 78%);
  color: #44328c;
}

html[data-theme="light"] .profile-tool-link--field-log[aria-selected="true"] {
  border-bottom-color: #a83e00;
  background: linear-gradient(0deg, rgb(214 83 8 / 23%), rgb(255 255 255 / 42%) 78%);
  color: #823200;
}

html[data-theme="light"] .profile-tool-link--resources[aria-selected="true"] {
  border-bottom-color: #1763a8;
  background: linear-gradient(0deg, rgb(40 123 201 / 22%), rgb(255 255 255 / 42%) 78%);
  color: #104f86;
}

html[data-theme="light"] .profile-page .button--secondary:hover:not(:disabled) {
  background: rgb(105 82 196 / 13%);
  color: #45358e;
}

html[data-theme="light"] :is(.availability-action--remove, .profile-certification-record__status[data-status="rejected"]) {
  color: #a52c34 !important;
}

html[data-theme="light"] .profile-dialog__body {
  background: radial-gradient(circle at 100% 0, rgb(105 82 196 / 10%), transparent 20rem), var(--color-surface);
}

html[data-theme="light"] :is(.private-contact-group, .certification-file-picker, .profile-certification-record, .availability-entry) {
  background: rgb(25 35 41 / 4%);
}

html[data-theme="light"] .profile-certification-record__status[data-status="approved"] { color: #176a42; }
html[data-theme="light"] .profile-certification-record__status[data-status="pending"] { color: #805307; }

html[data-theme="light"] .admin-page {
  background: radial-gradient(circle at 82% 0%, rgb(105 82 196 / 10%), transparent 36rem), radial-gradient(circle at 18% 25%, rgb(11 94 91 / 8%), transparent 28rem), var(--color-background);
}

html[data-theme="light"] .admin-sidebar {
  border-color: rgb(83 99 108 / 22%);
  background: linear-gradient(165deg, rgb(105 82 196 / 9%), transparent 18rem), rgb(247 249 250 / 98%);
}

html[data-theme="light"] .admin-topbar {
  background: linear-gradient(110deg, rgb(105 82 196 / 9%), transparent 38%), #f1f3f4;
  box-shadow: 0 0.75rem 2rem rgb(35 48 55 / 10%);
}

html[data-theme="light"] :is(.admin-panel, .admin-card, .metric-card, .admin-dialog) {
  background-color: rgb(255 255 255 / 96%);
}

html[data-theme="light"] .admin-table tbody tr:hover { background: rgb(105 82 196 / 7%); }

html[data-theme="light"] :is(.admin-button:not(.admin-button--primary):not(.admin-button--danger), .icon-button) {
  background-color: rgb(255 255 255 / 72%);
}

html[data-theme="light"] :is(.admin-button:not(.admin-button--primary):not(.admin-button--danger), .icon-button):hover {
  border-color: rgb(105 82 196 / 38%);
  background-color: rgb(105 82 196 / 10%);
}

/* Connected page atmosphere restored from the Color changes reference. The
 * main element owns the color field; sections add only transparent glows. */
html:not([data-theme="light"]) main:has(.home-hero) {
  background: linear-gradient(180deg, #0d1115 0%, #0e1518 22%, #10151d 31%, #0e1719 62%, #151418 82%, #12141a 100%);
}

html:not([data-theme="light"]) main:has(.about-story) {
  background: linear-gradient(180deg, #0d1115 0%, #0e1518 31%, #10151b 52%, #11161a 82%, #12141a 100%);
}

html:not([data-theme="light"]) main:has(.service-hero) {
  background:
    radial-gradient(circle at 88% 14%, rgb(244 106 18 / 13%), transparent 31rem),
    radial-gradient(circle at 7% 46%, rgb(56 183 176 / 11%), transparent 32rem),
    radial-gradient(circle at 92% 76%, rgb(128 103 232 / 13%), transparent 31rem),
    linear-gradient(180deg, #0d1115, #0f1719 44%, #14131a 79%, #12141a);
}

html[data-theme="light"] main:has(.home-hero) {
  background: linear-gradient(180deg, #f8fbfc 0%, #dff2f1 22%, #e6e8f7 31%, #e0f2ee 62%, #f7e6dc 82%, #e9e5f8 100%);
}

html[data-theme="light"] main:has(.about-story) {
  background: linear-gradient(180deg, #f8fbfc 0%, #dff2f1 31%, #e6e9f8 52%, #e9eef6 82%, #e9e5f8 100%);
}

html[data-theme="light"] main:has(.service-hero) {
  background:
    radial-gradient(circle at 88% 18%, rgb(239 97 18 / 21%), transparent 30rem),
    radial-gradient(circle at 6% 46%, rgb(0 156 145 / 18%), transparent 31rem),
    radial-gradient(circle at 92% 72%, rgb(115 89 216 / 19%), transparent 29rem),
    linear-gradient(180deg, #f9fbfc, #e2f2f0 42%, #ebe6f8 78%, #edf2f5);
}

html:not([data-theme="light"]) main:has(.home-hero) :is(.home-hero, .services-overview, .availability-section, .contact-section),
html:not([data-theme="light"]) main:has(.about-story) :is(.about-story, .about-founders, .about-experience),
html:not([data-theme="light"]) main:has(.service-hero) :is(.public-hero, .service-page-nav, .service-section, .service-details, .contact-section),
html[data-theme="light"] main:has(.home-hero) :is(.home-hero, .services-overview, .availability-section, .contact-section),
html[data-theme="light"] main:has(.about-story) :is(.about-story, .about-founders, .about-experience),
html[data-theme="light"] main:has(.service-hero) :is(.public-hero, .service-page-nav, .service-section, .service-details, .contact-section) {
  background-color: transparent;
}

html:not([data-theme="light"]) main:has(.home-hero) .services-overview {
  background-image: linear-gradient(180deg, rgb(14 21 24 / 35%), rgb(16 21 29 / 35%));
}

html[data-theme="light"] main:has(.home-hero) .services-overview {
  background-image: linear-gradient(180deg, rgb(231 243 243 / 34%), rgb(233 237 248 / 34%));
}

html:not([data-theme="light"]) main:has(.home-hero) .home-hero,
html:not([data-theme="light"]) main:has(.about-story) .about-story {
  background-image:
    linear-gradient(rgb(255 255 255 / 2%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(255 255 255 / 2%) 1px, transparent 1px),
    radial-gradient(circle at 84% 18%, var(--page-glow, rgb(128 103 232 / 19%)), transparent 28rem),
    radial-gradient(circle at 9% 88%, rgb(56 183 176 / 18%), transparent 30rem);
}

html[data-theme="light"] main:has(.home-hero) .home-hero,
html[data-theme="light"] main:has(.about-story) .about-story {
  background-image:
    linear-gradient(rgb(20 31 37 / 4%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(20 31 37 / 4%) 1px, transparent 1px),
    radial-gradient(circle at 86% 16%, var(--page-glow, rgb(115 89 216 / 24%)), transparent 29rem),
    radial-gradient(circle at 9% 86%, rgb(0 156 145 / 21%), transparent 31rem),
    radial-gradient(circle at 58% 104%, rgb(239 97 18 / 10%), transparent 23rem);
}

html:not([data-theme="light"]) main:has(.home-hero) .availability-section {
  background-image:
    radial-gradient(circle at 92% 14%, rgb(56 183 176 / 15%), transparent 30rem),
    radial-gradient(circle at 4% 86%, rgb(79 153 255 / 8%), transparent 25rem),
    radial-gradient(circle at 7% 112%, rgb(244 106 18 / 16%), transparent 30rem);
}

html[data-theme="light"] main:has(.home-hero) .availability-section {
  background-image:
    radial-gradient(circle at 92% 14%, rgb(0 156 145 / 24%), transparent 30rem),
    radial-gradient(circle at 4% 86%, rgb(40 123 201 / 17%), transparent 26rem),
    radial-gradient(circle at 7% 112%, rgb(239 97 18 / 25%), transparent 31rem);
}

html:not([data-theme="light"]) main:has(.home-hero) .contact-section {
  background-image:
    radial-gradient(circle at 7% 28%, rgb(244 106 18 / 18%), transparent 28rem),
    radial-gradient(circle at 94% 75%, rgb(128 103 232 / 17%), transparent 30rem);
}

html[data-theme="light"] main:has(.home-hero) .contact-section {
  background-image:
    radial-gradient(circle at 6% 28%, rgb(239 97 18 / 27%), transparent 29rem),
    radial-gradient(circle at 95% 76%, rgb(115 89 216 / 27%), transparent 31rem);
}

html:not([data-theme="light"]) main:has(.about-story) .about-founders {
  background-image:
    radial-gradient(circle at 5% 0%, rgb(56 183 176 / 13%), transparent 27rem),
    radial-gradient(circle at 94% 12%, rgb(79 153 255 / 13%), transparent 30rem);
}

html[data-theme="light"] main:has(.about-story) .about-founders {
  background-image:
    radial-gradient(circle at 5% 0%, rgb(0 156 145 / 21%), transparent 28rem),
    radial-gradient(circle at 94% 10%, rgb(40 123 201 / 23%), transparent 30rem);
}

html:not([data-theme="light"]) main:has(.about-story) .about-experience {
  background-image:
    radial-gradient(circle at 5% 38%, rgb(128 103 232 / 11%), transparent 29rem),
    radial-gradient(circle at 95% 82%, rgb(244 106 18 / 8%), transparent 25rem);
}

html[data-theme="light"] main:has(.about-story) .about-experience {
  background-image:
    radial-gradient(circle at 4% 40%, rgb(115 89 216 / 20%), transparent 29rem),
    radial-gradient(circle at 96% 76%, rgb(239 97 18 / 15%), transparent 26rem);
}

html[data-theme="light"] main:has(.service-hero) > .contact-section,
html:not([data-theme="light"]) main:has(.service-hero) > .contact-section {
  background: transparent;
}

html[data-theme="light"] :is(.package-card, .addon-card) {
  background:
    radial-gradient(circle at 95% 0, color-mix(in srgb, var(--package-accent, var(--addon-accent)) 20%, transparent), transparent 12rem),
    rgb(255 255 255 / 93%);
  box-shadow: 0 1rem 2.75rem rgb(44 58 71 / 12%);
}

html[data-theme="light"] .contact-form {
  border-color: rgb(168 62 0 / 19%);
  background:
    linear-gradient(145deg, rgb(239 97 18 / 7%), transparent 48%),
    rgb(255 255 255 / 91%);
  box-shadow: 0 1.25rem 3.25rem rgb(63 49 78 / 15%);
}

main:has(.about-story) .about-founders {
  position: relative;
}

main:has(.about-story) .about-founders::before,
main:has(.about-story) .about-founders::after {
  position: absolute;
  z-index: 1;
  right: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 3%, var(--color-teal-400) 24%, var(--color-purple-400) 54%, var(--color-blue-400) 78%, transparent 97%);
  content: "";
  opacity: 0.45;
  pointer-events: none;
}

main:has(.about-story) .about-founders::before { top: 0; }
main:has(.about-story) .about-founders::after { bottom: 0; opacity: 0.28; }

html[data-theme="light"] :is(.service-page-nav, .service-section--addons) {
  border-color: rgb(89 68 174 / 18%);
}

html[data-theme="light"] .services-overview__grid {
  box-shadow:
    inset 0 1px rgb(8 115 109 / 15%),
    inset 0 -1px rgb(89 68 174 / 15%);
}