/* Espresso, aubergine and ivory palette shared across the site. Legacy variable names remain
   for compatibility with earlier theme layers. */

:root {
  --bg: #20171A !important;
  --panel: #241A1D !important;
  --panel2: #2C2023 !important;
  --b3-ink: #20171A;
  --b3-ink-2: #241A1D;
  --b3-ink-3: #2C2023;
  --b3-paper-ink: #241A1D;
  --b3-light-line: rgba(53, 37, 40, .16);
  --wine: #2C2023;
  --wine2: #352528;
  --wine-soft: rgba(169, 167, 161, .18);
  --wine-glow: rgba(169, 167, 161, .30);

  --b3-wine: #2C2023;
  --b3-wine-deep: #20171A;
  --b3-wine-mid: #2C2023;
  --b3-wine-bright: #F1EEE7;

  --brawnd-wine-deep: #20171A;
  --brawnd-wine-mid: #2C2023;

  /* Ivory actions remain legible against the darker aubergine surfaces. */
  --brawnd-moss-light: #352528;
  --brawnd-moss-mid: #2C2023;
  --brawnd-moss-deep: #20171A;
  --brawnd-moss-accent: #F1EEE7;
  --brawnd-moss-button: #F1EEE7;
  --brawnd-moss-button-hover: #F1EEE7;
}

/* Header + primary conversion actions. */
.nav-links .nav-cta,
.btn-primary,
.studio-cta .btn-primary {
  background: var(--brawnd-moss-button) !important;
  color: #20171A !important;
  border-color: rgba(241, 238, 231, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    inset 0 -1px 0 rgba(20, 36, 23, .26),
    0 12px 30px rgba(0, 0, 0, .24) !important;
}

.nav-links .nav-cta:hover,
.btn-primary:hover,
.studio-cta .btn-primary:hover {
  background: var(--brawnd-moss-button-hover) !important;
  box-shadow:
    inset 0 1px 0 rgba(231, 242, 220, .28),
    inset 0 -1px 0 rgba(20, 36, 23, .22),
    0 16px 38px rgba(0, 0, 0, .28) !important;
}

/* Global atmosphere and legacy palette aliases. */
.hero::before {
  background: radial-gradient(circle, rgba(169, 167, 161, .34), rgba(169, 167, 161, .09) 44%, transparent 70%) !important;
}
.hero::after {
  background: linear-gradient(110deg, transparent 0 55%, rgba(169, 167, 161, .035) 70%, transparent 88%) !important;
}
.eyebrow::before {
  box-shadow: 0 0 24px rgba(169, 167, 161, .62) !important;
}
.orb {
  border-color: rgba(169, 167, 161, .34) !important;
}
.core {
  background: radial-gradient(circle at 35% 30%, #2C2023, #2C2023 49%, #20171A 100%) !important;
  box-shadow: 0 0 105px rgba(169, 167, 161, .30), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.card::after {
  background: radial-gradient(circle, rgba(169, 167, 161, .15), transparent 70%) !important;
}
.card:hover {
  background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(169, 167, 161, .025)) !important;
}
.card .num,
.service-card li::before {
  color: #2C2023 !important;
}

/* Animated Brawnd object keeps its sculptural depth in muted moss. */
.brawnd-piece {
  background: linear-gradient(145deg, #2C2023 0%, #2C2023 48%, #20171A 100%) !important;
}
.brawnd-piece.p5,
.brawnd-piece.p6,
.brawnd-piece.p7 {
  background: linear-gradient(145deg, #2C2023, #2C2023 62%, #2C2023) !important;
}
.brawnd-block-stage.is-refine .p7 {
  box-shadow: 0 0 0 1px rgba(255,255,255,.06), 0 12px 34px rgba(169, 167, 161, .31) !important;
}

/* Homepage hero uses the approved espresso canvas. */
.b2-hero {
  background: #1B1417 !important;
}
.b2-hero::before {
  background: radial-gradient(circle, rgba(169, 167, 161, .07), transparent 72%) !important;
}
.b2-hero .hero-dynamic-text {
  background: linear-gradient(95deg, #F1EEE7, #F1EEE7) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
.b2-hero-kicker::before {
  background: #F1EEE7 !important;
}
.b2-hero-belief,
.b2-insight-card {
  background: linear-gradient(145deg, rgba(28, 24, 25, .94), rgba(15, 13, 14, .84)) !important;
}
.b2-belief-signoff i {
  background: #2C2023 !important;
}
.b2-hero .hero-visual > .brawnd-block-stage {
  filter: drop-shadow(0 36px 85px rgba(0,0,0,.45)) drop-shadow(0 0 48px rgba(169, 167, 161, .18)) !important;
}
.b2-journey-path i {
  background: linear-gradient(to top, #2C2023, #2C2023) !important;
}
.b2-journey-path i:nth-child(4) {
  background: linear-gradient(to top, #2C2023, #2C2023) !important;
}
.b2-growth-path {
  stroke: #F1EEE7 !important;
  filter: drop-shadow(0 0 7px rgba(169, 167, 161, .30)) !important;
}
.b2-growth-line circle {
  fill: #F1EEE7 !important;
  stroke: #2C2023 !important;
}

/* Statement surfaces use restrained aubergine layers. */
.trust-strip.is-proof-strip {
  background:
    radial-gradient(circle at 83% 12%, rgba(169, 167, 161, .06), transparent 28%),
    linear-gradient(118deg, #241A1D 0%, #2C2023 52%, #241A1D 100%) !important;
}

#process.b2-section--wine,
.studio-cta {
  background:
    radial-gradient(ellipse at 78% 8%, rgba(169, 167, 161, .09), transparent 34%),
    linear-gradient(128deg, #241A1D 0%, #2C2023 54%, #241A1D 100%) !important;
}
#process .b2-process-bar {
  background: #F1EEE7 !important;
  color: #2C2023 !important;
}
#process .b2-process-bar--3 {
  background: #2C2023 !important;
  color: #F1EEE7 !important;
}

/* Light sections use ivory with graphite for readable accents. */
#strength,
#work,
#about,
.studio-page .studio-section.is-light,
.legal-page .legal-body {
  background:
    radial-gradient(circle at 86% 0%, rgba(169, 167, 161, .028), transparent 31%),
    linear-gradient(180deg, #F1EEE7 0%, #ECE8DE 100%) !important;
}

#work .b2-engagement {
  background:
    radial-gradient(circle at 92% 8%, rgba(169, 167, 161, .05), transparent 34%),
    rgba(255,255,255,.34) !important;
  box-shadow: 0 30px 80px rgba(169, 167, 161, .05) !important;
}
#work .b2-engagement::after {
  border-color: rgba(169, 167, 161, .15) !important;
}

/* Dark sections carry the approved espresso base. */
#services,
#faq,
.studio-page .studio-section.is-dark {
  background:
    radial-gradient(ellipse at 6% 90%, rgba(169, 167, 161, .055), transparent 36%),
    linear-gradient(180deg, #20171A 0%, #241A1D 100%) !important;
}
#services .b2-service-num,
#faq .b2-faq summary span {
  color: #F1EEE7 !important;
}

/* Contact and interior hero surfaces. */
.b2-contact,
.studio-page--contact .studio-contact-page {
  background:
    radial-gradient(ellipse at 0% 0%, rgba(169, 167, 161, .07), transparent 38%),
    #20171A !important;
}
.studio-hero {
  background:
    radial-gradient(ellipse at 86% 18%, rgba(169, 167, 161, .06), transparent 36%),
    linear-gradient(180deg, #20171A 0%, #241A1D 100%) !important;
}
.legal-hero {
  background: linear-gradient(180deg, #20171A, #241A1D) !important;
}

/* Legal illustrations and other components that still consume the legacy vars
   inherit moss through the legacy aliases declared above. */

html[data-theme="light"] .hero::before {
  background: radial-gradient(circle, rgba(169, 167, 161, .16), rgba(169, 167, 161, .05) 44%, transparent 70%) !important;
}
html[data-theme="light"] .hero::after {
  background: linear-gradient(110deg, transparent 0 55%, rgba(169, 167, 161, .028) 70%, transparent 88%) !important;
}
html[data-theme="light"] .card {
  background: linear-gradient(145deg, rgba(255,255,255,.72), rgba(169, 167, 161, .014)) !important;
}
html[data-theme="light"] .card:hover {
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(169, 167, 161, .025)) !important;
}
html[data-theme="light"] .service-card.featured-service {
  border-color: rgba(169, 167, 161, .24) !important;
  background: linear-gradient(145deg, rgba(169, 167, 161, .055), rgba(255,255,255,.76)) !important;
}
html[data-theme="light"] .growth-row:hover,
html[data-theme="light"] .process-row:hover {
  background: linear-gradient(90deg, rgba(169, 167, 161, .044), transparent 78%) !important;
}
html[data-theme="light"] .project-field input:focus,
html[data-theme="light"] .project-field textarea:focus {
  border-color: rgba(169, 167, 161, .50) !important;
  box-shadow: 0 0 0 3px rgba(169, 167, 161, .085) !important;
}


/* Preserve ivory actions across pages and high-specificity rules. */
.b2-hero .btn-primary,
.b2-contact .btn-primary,
.studio-cta .btn-primary,
.nav-links .nav-cta {
  background: var(--brawnd-moss-button) !important;
  border-color: rgba(169, 167, 161, .34) !important;
  color: #20171A !important;
  box-shadow:
    inset 0 1px 0 rgba(231, 242, 220, .22),
    inset 0 -1px 0 rgba(20, 36, 23, .26),
    0 14px 34px rgba(0, 0, 0, .28) !important;
}

.b2-hero .btn-primary:hover,
.b2-contact .btn-primary:hover,
.studio-cta .btn-primary:hover,
.nav-links .nav-cta:hover {
  background: var(--brawnd-moss-button-hover) !important;
  border-color: rgba(169, 167, 161, .48) !important;
  box-shadow:
    inset 0 1px 0 rgba(231, 242, 220, .28),
    inset 0 -1px 0 rgba(20, 36, 23, .22),
    0 18px 42px rgba(0, 0, 0, .32) !important;
}

/* Inline arrows, numerals, markers and interactive details. */
.text-link span,
.growth-row span,
.process-row span,
summary span,
.b2-service-num,
.b2-strength-num,
.b2-principle span,
.b2-inline-cta span,
.studio-block .num,
.studio-process-row span,
.service-card li::before,
.card .num {
  color: #2C2023 !important;
}

#services .b2-service-num,
#faq summary span,
#process .b2-inline-cta span,
#process .process-row span,
.studio-cta .b2-inline-cta span,
.studio-section.is-dark .studio-block .num,
.hero .text-link span,
#services .text-link span,
#faq .text-link span,
.studio-section.is-dark .text-link span,
html:not([data-theme="light"]) .card .num,
html:not([data-theme="light"]) .service-card li::before {
  color: #F1EEE7 !important;
}
#strength .b2-strength-num { color: #2C2023 !important; }

.eyebrow::before,
.b2-kicker::before,
.studio-kicker::before {
  background: #F1EEE7 !important;
  box-shadow: 0 0 18px rgba(169, 167, 161, .24) !important;
}

/* Cards, work surfaces and focus states. */
.work-card::before {
  background: radial-gradient(circle, #2C2023, rgba(169, 167, 161, .16) 46%, transparent 70%) !important;
}

.growth-row:hover,
.process-row:hover {
  background: linear-gradient(90deg, rgba(169, 167, 161, .055), transparent 78%) !important;
}

.project-field input:focus,
.project-field textarea:focus,
.b2-contact input:focus,
.b2-contact textarea:focus,
.studio-page--contact input:focus,
.studio-page--contact textarea:focus {
  border-color: rgba(169, 167, 161, .52) !important;
  box-shadow: 0 0 0 3px rgba(169, 167, 161, .10) !important;
}

/* Standalone studio pages: remove the old wine atmosphere hard-coded
   in alternating section surfaces. */
.studio-page--services > .studio-section:nth-of-type(2),
.studio-page--services > .studio-section:nth-of-type(4),
.studio-page--about > .studio-section:nth-of-type(2),
.studio-page--process > .studio-section:nth-of-type(2) {
  background:
    radial-gradient(circle at 88% 0%, rgba(169, 167, 161, .028), transparent 30%),
    linear-gradient(180deg, #F1EEE7 0%, #ECE8DE 100%) !important;
}

.studio-page--services > .studio-section:nth-of-type(3),
.studio-page--services > .studio-section:nth-of-type(5),
.studio-page--about > .studio-section:nth-of-type(3),
.studio-page--process > .studio-section:nth-of-type(3) {
  background:
    radial-gradient(ellipse at 8% 100%, rgba(169, 167, 161, .05), transparent 35%),
    linear-gradient(180deg, #20171A, #241A1D) !important;
}

.studio-page--process > .studio-section:nth-of-type(2) .b2-process-bar--3 {
  background: #2C2023 !important;
}

/* Legal artwork and miscellaneous decorative pieces that used direct wine
   fallbacks rather than variables. */
.legal-visual-stage,
.privacy-orbit,
.access-orbit,
.terms-seal,
.cookie-store i::after {
  border-color: rgba(169, 167, 161, .30) !important;
}

.privacy-shield,
.terms-seal,
.access-core {
  background-color: #2C2023 !important;
}

/* Keep warm cream as the secondary visual family. */
::selection {
  background: #F1EEE7 !important;
  color: #20171A !important;
}

/* Carry the hero's restrained surfaces into navigation and the footer. */
.site-header {
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header .nav,
.site-header.scrolled .nav {
  background: rgba(44, 32, 35, .96) !important;
  border-color: rgba(241, 238, 231, .14) !important;
  backdrop-filter: blur(18px) saturate(112%);
  -webkit-backdrop-filter: blur(18px) saturate(112%);
}

.site-footer {
  background: #151215 !important;
  border-top-color: rgba(241, 238, 231, .12) !important;
}

.b2-contact .contact-card,
.studio-page--contact .contact-card {
  background: #241A1D !important;
  border-color: rgba(241, 238, 231, .14) !important;
}

.b2-contact input,
.b2-contact textarea,
.studio-page--contact input,
.studio-page--contact textarea {
  background: #20171A !important;
  border-color: rgba(241, 238, 231, .16) !important;
}

/* Keep detail accents visible against ivory sections. */
.studio-section.is-light .studio-kicker::before { background:#352528!important; }
