/* =========================================================
   VOLTA METHOD — theme-dark.css
   Dark theme override layer
   Load after styles.css
========================================================= */

:root{
  /* Core dark palette */
  --bg: #2f2e2a;
  --bg-alt: #373631;
  --bg-soft: #403e37;

  --heading-text: #fafafa;
  --text: #d8d7d3;
  --muted: rgba(216,215,211,.72);

  --line: rgba(217,215,212,.14);
  --line-strong: rgba(217,215,212,.18);

  /* Accent system */
  --accent: #d9d7d4;
  --accent-hover: #ffffff;
  --volta-gold: #b79a6a;

  /* Dark shadows */
  --shadow: 0 18px 45px rgba(0,0,0,.45);

  /* Hero */
  --hero-height: 650px;
  --hero-height-mobile: 380px;
  --hero-overlay: transparent;
}

/* =========================================================
   GLOBAL SURFACES
========================================================= */

body{
  background: var(--bg);
  color: var(--text);
}

h1,
h2,
h3,
h4,
h5,
h6{
  color: var(--heading-text);
}

/* =========================================================
   HEADER / NAV
========================================================= */

.header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;

  background: rgba(47,46,42,.5);
  border-bottom: 0;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.nav__link{
  color: var(--muted);
}

.nav__link:hover,
.nav__link.is-active{
  background: rgba(217,215,212,.08);
  color: var(--text);
}

.nav__lang{
  color: var(--muted);
}

.nav__lang-item.is-active{
  color: var(--text);
}

.nav__lang-sep{
  color: rgba(217,215,212,.24);
}

.nav__toggle{
  background: transparent;
  color: var(--text);
  border-color: var(--line);
}

/* Retained only in case nav CTA class is restored later */
.nav__link--cta{
  background: var(--text);
  color: var(--bg);
}

.nav__link--cta:hover{
  background: transparent;
  color: var(--text);
  border-color: var(--text);
}

/* =========================================================
   BUTTONS
========================================================= */

.btn{
  background: transparent;
  color: var(--heading-text);
  border-color: var(--heading-text);
}

.btn--primary,
.hero__cta{
  background: transparent;
  color: var(--heading-text);
  border-color: var(--heading-text);
}

.btn--primary:hover,
.hero__cta:hover{
  background: rgba(250,250,250,.50);
  color: var(--bg);
  border-color: var(--heading-text);
}

/* =========================================================
   HERO
========================================================= */

.hero{
  color: var(--text);
}

.hero__subtitle{
  color: var(--text);
}

/* =========================================================
   SECTIONS
========================================================= */

.volta-method,
.modalities,
.contact-section,
.footer{
  background: var(--bg);
}

.alignment{
  background: var(--bg-soft);
}

.process{
  background: var(--bg-alt);
}

/* =========================================================
   CONTENT PANELS / CARDS
========================================================= */

.volta-method__mid,
.alignment__item,
.form{
  background: rgba(217,215,212,.06);
  border: 1px solid rgba(217,215,212,.10);
}

.volta-method__mid{
  color: var(--text);
}

.alignment__item{
  color: var(--text);
}

.footer{
  border-top-color: var(--line);
}

/* =========================================================
   MODALITIES
========================================================= */

.modtabs__list{
  border-top-color: var(--line);
}

.modtabs__tab{
  color: var(--text);
  border-bottom-color: var(--line);
}

.modtabs__tab:hover{
  background: rgba(217,215,212,.06);
}

.modtabs__tab.is-active{
  background: rgba(183,154,106,.16);
  border-right-color: var(--volta-gold);
}

.modtabs__icon .material-symbols-outlined{
  color: var(--volta-gold);
}

/* =========================================================
   FORM
========================================================= */

.field input,
.field textarea,
.field select{
  background: rgba(255,255,255,.04);
  color: var(--text);
  border-color: var(--line);
}

.field input:focus,
.field textarea:focus,
.field select:focus{
  border-color: rgba(217,215,212,.38);
}

.field textarea::placeholder{
  color: rgba(217,215,212,.48);
}

.form__hint,
.form__status{
  color: var(--muted);
}

.form__status.is-success{
  color: #9bd2a8;
}

.form__status.is-error{
  color: #e3a0a0;
}

/* =========================================================
   INFO ROWS / FOOTER LINKS
========================================================= */

.infoRow{
  color: var(--muted);
}

.infoRow__value{
  color: var(--text);
}

.footer__inner{
  color: var(--muted);
}

.footer__links a{
  color: var(--muted);
}

.footer__links a:hover{
  color: var(--text);
}

/* =========================================================
   PLACEHOLDERS
========================================================= */

.imgph{
  background: rgba(217,215,212,.04);
  border-color: rgba(217,215,212,.20);
  color: var(--muted);
}

/* =========================================================
   MOBILE NAV
========================================================= */

@media (max-width: 640px){
  .nav__menu{
    background: rgba(47,46,42,.98);
    border-color: var(--line);
  }
}