/* ============================================================
   Elvaris & Co — css/style.css
   Design system: "Ledger Sage" editorial stripe layout
   Class convention: elv.module.element--variant (dot-separated,
   escaped in CSS as .elv\.module\.element--variant)
   ============================================================ */

/* ---------- Fonts are loaded via partials/head.html (Google Fonts) ---------- */

:root{
  /* shared palette tokens (cookie banner + all components read these) */
  --site-bg:#EAEEE1;
  --site-surface:#F7F6EF;
  --site-text:#23281F;
  --site-muted:#737B6C;
  --site-accent:#5B6B4F;
  --site-accent2:#B79A6B;

  /* site-only extensions */
  --elv-olive:#E3E7D8;
  --elv-ink:#23281F;
  --elv-line: rgba(35,40,31,.16);
  --elv-line-strong: rgba(35,40,31,.32);
  --elv-error:#9C4B36;

  --font-head:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-body:'Work Sans', -apple-system, BlinkMacSystemFont, sans-serif;

  --container: 1160px;
  --pad-side: clamp(20px, 5vw, 40px);
  --pad-band: clamp(48px, 9vw, 92px);
}

/* ---------------------------------- RESET ---------------------------------- */
*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
html,body{
  max-width:100%;
  overflow-x:hidden;
}
body{
  margin:0;
  background:var(--site-bg);
  color:var(--site-text);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{ display:block; max-width:100%; }
a{ color:inherit; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p,figure{ margin:0; }
input,textarea,select{ font:inherit; color:inherit; }
address{ font-style:normal; }

::selection{ background:var(--site-accent); color:#fff; }

h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:600;
  color:var(--site-text);
  letter-spacing:-0.01em;
}

:focus-visible{
  outline:2px solid var(--site-accent);
  outline-offset:3px;
}

/* ---------------------------------- LAYOUT ---------------------------------- */
.elv\.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--pad-side);
}

.elv\.band{
  padding:var(--pad-band) 0;
  position:relative;
}
.elv\.band--sage{ background:var(--site-bg); }
.elv\.band--ivory{ background:var(--site-surface); }
.elv\.band--olive{ background:var(--elv-olive); }
.elv\.band--ink{ background:var(--elv-ink); color:var(--site-bg); }

/* Signature element: ledger-line numeral + full-width rule */
.elv\.section\.head{
  display:flex;
  align-items:baseline;
  gap:24px;
  margin-bottom:clamp(32px,5vw,56px);
}
.elv\.section\.index{
  flex:none;
  font-family:var(--font-head);
  font-variant-numeric:tabular-nums;
  font-size:.85rem;
  letter-spacing:.14em;
  color:var(--site-accent);
}
.elv\.section\.rule{
  flex:1;
  height:1px;
  background:var(--elv-line-strong);
}
.elv\.band--ink .elv\.section\.rule{ background:rgba(234,238,225,.25); }
.elv\.band--ink .elv\.section\.index{ color:var(--site-accent2); }

.elv\.section\.title{
  font-size:clamp(1.7rem,3.2vw,2.5rem);
  line-height:1.16;
  margin:0 0 16px;
}
.elv\.section\.title--lg{
  font-size:clamp(2rem,4vw,3rem);
  line-height:1.1;
}
.elv\.section\.lede{
  color:var(--site-muted);
  max-width:680px;
  font-size:1.05rem;
  line-height:1.75;
}
.elv\.band--ink .elv\.section\.lede{ color:#C8CDBC; }

/* ---------------------------------- BUTTONS ---------------------------------- */
.elv\.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:15px 30px;
  font-family:var(--font-head);
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid var(--site-text);
  color:var(--site-text);
  background:transparent;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .15s ease;
}
.elv\.btn:hover{ transform:translateY(-1px); }
.elv\.btn--primary{
  background:var(--site-accent);
  border-color:var(--site-accent);
  color:#F7F6EF;
}
.elv\.btn--primary:hover{ background:#4b5940; border-color:#4b5940; }
.elv\.btn--outline{
  border-color:var(--site-accent2);
  color:var(--site-text);
}
.elv\.btn--outline:hover{ background:var(--site-accent2); color:#23281F; }
.elv\.btn--ghost{
  border-color:transparent;
  padding-left:0; padding-right:0;
  color:var(--site-accent);
}
.elv\.btn--ghost:hover{ text-decoration:underline; }
.elv\.band--ink .elv\.btn{ border-color:var(--site-bg); color:var(--site-bg); }
.elv\.band--ink .elv\.btn--primary{ background:var(--site-accent2); border-color:var(--site-accent2); color:#23281F; }

/* ---------------------------------- HEADER ---------------------------------- */
#brand-bar-rza{
  position:sticky;
  top:0;
  z-index:120;
  background:var(--site-surface);
  transition:box-shadow .25s ease;
}
#brand-bar-rza.is-scrolled{ box-shadow:0 1px 0 var(--elv-line-strong); }

.elv\.header\.utility{
  background:var(--elv-ink);
  color:#C8CDBC;
}
.elv\.header\.utility\.inner{
  max-width:var(--container);
  margin:0 auto;
  padding:9px var(--pad-side);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  font-family:var(--font-head);
  font-size:.72rem;
  letter-spacing:.06em;
}
.elv\.header\.utility\.item{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.elv\.header\.utility\.item i{ color:var(--site-accent2); font-size:.75em; }
.elv\.header\.utility\.item a{ text-decoration:none; color:inherit; }
.elv\.header\.utility\.reg{ color:#9BA38C; }
.elv\.lang\.btn{
  color:#9BA38C;
  padding:2px 4px;
  font-family:var(--font-head);
  font-size:.72rem;
  letter-spacing:.06em;
}
.elv\.lang\.btn.is-active{ color:var(--site-bg); border-bottom:1px solid var(--site-accent2); }

.elv\.header\.main\.inner{
  max-width:var(--container);
  margin:0 auto;
  padding:22px var(--pad-side);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}

.elv\.brand{
  display:inline-flex;
  align-items:baseline;
  gap:12px;
  text-decoration:none;
  color:var(--site-text);
}
.elv\.brand\.mark{
  width:32px;
  height:32px;
  flex:none;
  color:var(--site-accent);
  align-self:center;
}
.elv\.brand\.word{
  font-family:var(--font-head);
  font-weight:600;
  font-size:1.2rem;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.elv\.nav{
  display:none;
  align-items:center;
  gap:clamp(20px,3vw,40px);
}
.elv\.nav\.item{
  font-family:var(--font-head);
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--site-text);
  padding-bottom:5px;
  border-bottom:2px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
.elv\.nav\.item:hover, .elv\.nav\.item.is-active{
  color:var(--site-accent);
  border-color:var(--site-accent);
}

.elv\.nav\.toggle{
  display:inline-flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px;
  height:40px;
  align-items:center;
  border:1px solid var(--elv-line-strong);
}
.elv\.nav\.toggle span{
  display:block;
  width:20px;
  height:2px;
  background:var(--site-text);
  transition:transform .25s ease, opacity .25s ease;
}
.elv\.nav\.toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.elv\.nav\.toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.elv\.nav\.toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Mobile drawer — does NOT lock page scroll */
#dim-470{
  position:fixed; inset:0;
  background:rgba(35,40,31,.55);
  z-index:150;
  opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
}
#dim-470.is-open{ opacity:1; visibility:visible; }

#mobile-nav-zxa{
  position:fixed;
  top:0; right:0;
  height:100vh;
  width:min(340px,86vw);
  background:var(--site-surface);
  z-index:160;
  padding:28px 26px;
  transform:translateX(100%);
  transition:transform .32s ease;
  overflow-y:auto;
  border-left:1px solid var(--elv-line-strong);
}
#mobile-nav-zxa.is-open{ transform:translateX(0); }

.elv\.drawer\.head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:24px;
  border-bottom:1px solid var(--elv-line);
  margin-bottom:24px;
}
#x-btn-as7{
  width:36px; height:36px;
  border:1px solid var(--elv-line-strong);
  font-size:1.2rem;
  display:grid; place-items:center;
}
.elv\.drawer\.nav{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.elv\.drawer\.nav a{
  display:block;
  padding:14px 4px;
  font-family:var(--font-head);
  font-size:.9rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--site-text);
  border-bottom:1px solid var(--elv-line);
}

/* ---------------------------------- FOOTER ---------------------------------- */
.elv\.footer{
  background:var(--elv-ink);
  color:#D8DCCA;
  padding-top:var(--pad-band);
}
.elv\.footer\.inner{
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--pad-side) 64px;
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1fr;
  gap:48px;
}
.elv\.footer\.brand .elv\.brand{ color:var(--site-bg); margin-bottom:18px; }
.elv\.footer\.brand .elv\.brand\.mark{ color:var(--site-accent2); }
.elv\.footer\.blurb{
  font-size:.95rem;
  line-height:1.75;
  color:#B7BEA7;
  max-width:32ch;
  margin-bottom:18px;
}
.elv\.footer\.legal\.line{
  font-size:.82rem;
  color:#8F977F;
  line-height:1.6;
}
.elv\.footer\.heading{
  font-family:var(--font-head);
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--site-accent2);
  margin-bottom:20px;
}
.elv\.footer\.sitemap a,
.elv\.footer\.contact\.link{
  display:block;
  padding:7px 0;
  color:#C8CDBC;
  text-decoration:none;
  font-size:.9rem;
  font-family:var(--font-head);
  letter-spacing:.02em;
}
.elv\.footer\.sitemap a:hover,
.elv\.footer\.contact\.link:hover{ color:var(--site-accent2); }
.elv\.footer\.address{
  font-size:.88rem;
  line-height:1.7;
  color:#B7BEA7;
  margin-bottom:10px;
}
.elv\.footer\.regs{
  font-size:.82rem;
  color:#9BA38C;
  line-height:2;
  font-family:var(--font-head);
  margin-bottom:16px;
}
.elv\.footer\.legal\.links a{
  display:inline-block;
  color:#C8CDBC;
  text-decoration:none;
  font-size:.82rem;
  margin-right:14px;
  border-bottom:1px solid rgba(199,205,188,.3);
}
.elv\.footer\.legal\.links a:hover{ color:var(--site-accent2); }

.elv\.footer\.bottom{ border-top:1px solid rgba(234,238,225,.14); }
.elv\.footer\.bottom\.inner{
  max-width:var(--container);
  margin:0 auto;
  padding:22px var(--pad-side);
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:space-between;
  font-size:.8rem;
  color:#8F977F;
  font-family:var(--font-head);
}

/* ---------------------------------- HERO (full-bleed) ---------------------------------- */
.elv\.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:var(--elv-ink);
}
.elv\.hero\.media{ position:absolute; inset:0; }
.elv\.hero\.media img{ width:100%; height:100%; object-fit:cover; }
.elv\.hero\.scrim{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,24,16,.35) 0%, rgba(20,24,16,.72) 78%, rgba(20,24,16,.86) 100%);
}
.elv\.hero\.inner{
  position:relative;
  z-index:2;
  max-width:820px;
  margin:0 auto;
  text-align:center;
  padding:0 var(--pad-side);
  color:#F7F6EF;
}
.elv\.hero\.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--font-head);
  font-size:.78rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--site-accent2);
  margin-bottom:24px;
}
.elv\.hero\.title--lg{
  font-size:clamp(2.3rem,6.2vw,4.4rem);
  line-height:1.06;
  color:#F7F6EF;
  margin-bottom:22px;
}
.elv\.hero\.sub{
  font-size:clamp(1rem,1.6vw,1.2rem);
  color:#D8DCCA;
  line-height:1.7;
  max-width:56ch;
  margin:0 auto;
}
.elv\.hero\.actions{
  margin-top:36px;
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}

/* ---------------------------------- PAGE HERO variants ---------------------------------- */
.elv\.page-hero{ padding:var(--pad-band) 0; }
.elv\.page-hero\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
  align-items:center;
}
.elv\.page-hero\.eyebrow{
  font-family:var(--font-head);
  font-size:.78rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--site-accent);
  margin-bottom:18px;
}
.elv\.page-hero\.title{
  font-size:clamp(2rem,4.4vw,3.1rem);
  line-height:1.1;
  margin-bottom:18px;
}
.elv\.page-hero\.text{
  color:var(--site-muted);
  font-size:1.05rem;
  line-height:1.75;
  max-width:52ch;
}
.elv\.page-hero\.media{
  aspect-ratio:4/3;
  overflow:hidden;
  background:var(--elv-olive);
}
.elv\.page-hero\.media img{ width:100%; height:100%; object-fit:cover; }

/* split (side image) */
.elv\.page-hero--split .elv\.page-hero\.grid{ grid-template-columns:1.05fr 1fr; }

/* type-only over olive band */
.elv\.page-hero--olive{ background:var(--elv-olive); text-align:center; }
.elv\.page-hero--olive .elv\.page-hero\.text{ margin-left:auto; margin-right:auto; }
.elv\.page-hero--olive .elv\.page-hero\.eyebrow{ justify-content:center; display:block; }

/* centered compact */
.elv\.page-hero--compact{ padding:calc(var(--pad-band) * .6) 0; text-align:center; }
.elv\.page-hero--compact .elv\.page-hero\.title{ max-width:20ch; margin-left:auto; margin-right:auto; }
.elv\.page-hero--compact .elv\.page-hero\.text{ margin-left:auto; margin-right:auto; }

/* ---------------------------------- BEFORE / AFTER (compare) ---------------------------------- */
.elv\.compare\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:48px;
  align-items:start;
}
.elv\.compare\.text{ display:grid; gap:32px; }
.elv\.compare\.col{ padding-left:20px; border-left:3px solid var(--elv-line-strong); }
.elv\.compare\.col--now{ border-left-color:var(--site-accent); }
.elv\.compare\.col\.label{
  font-family:var(--font-head);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--site-muted);
  margin-bottom:10px;
}
.elv\.compare\.col--now .elv\.compare\.col\.label{ color:var(--site-accent); }
.elv\.compare\.col p{ color:var(--site-muted); line-height:1.75; }
.elv\.compare\.media{
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--elv-olive);
}
.elv\.compare\.media img{ width:100%; height:100%; object-fit:cover; }

/* ---------------------------------- WHY US (reasons) ---------------------------------- */
.elv\.reasons\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
}
.elv\.reason\.card{
  border-top:1px solid var(--elv-line-strong);
  padding-top:26px;
}
.elv\.reason\.num{
  font-family:var(--font-head);
  font-size:.85rem;
  color:var(--site-accent2);
  letter-spacing:.1em;
  display:block;
  margin-bottom:16px;
}
.elv\.reason\.title{ font-size:1.25rem; margin-bottom:12px; }
.elv\.reason\.text{ color:var(--site-muted); line-height:1.75; }

/* ---------------------------------- AUDIENCE (personas — trois chapitres) ---------------------------------- */
.elv\.persona\.list{ display:flex; flex-direction:column; }
.elv\.persona\.item{
  display:grid;
  grid-template-columns:1fr;
  gap:32px;
  align-items:center;
  padding:40px 0;
  border-bottom:1px solid var(--elv-line);
}
.elv\.persona\.item:first-child{ padding-top:0; }
.elv\.persona\.media{
  aspect-ratio:3/4;
  overflow:hidden;
  background:var(--elv-olive);
}
.elv\.persona\.media img{ width:100%; height:100%; object-fit:cover; }
.elv\.persona\.kicker{
  font-family:var(--font-head);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--site-accent);
  margin-bottom:14px;
}
.elv\.persona\.title{ font-size:1.4rem; margin-bottom:14px; }
.elv\.persona\.text{ color:var(--site-muted); line-height:1.8; max-width:56ch; }

/* ---------------------------------- GALLERY ---------------------------------- */
.elv\.gallery\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
}
.elv\.gallery\.item{
  aspect-ratio:4/5;
  overflow:hidden;
  background:var(--elv-olive);
}
.elv\.gallery\.item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.elv\.gallery\.item:hover img{ transform:scale(1.04); }

/* ---------------------------------- CTA STRIP variants ---------------------------------- */
.elv\.cta\.strip\.inner{ text-align:center; }
.elv\.cta\.strip\.title{ font-size:clamp(1.6rem,3.4vw,2.3rem); margin-bottom:14px; }
.elv\.cta\.strip\.text{ color:var(--site-muted); max-width:52ch; margin:0 auto 30px; line-height:1.7; }
.elv\.band--ink .elv\.cta\.strip\.text{ color:#C8CDBC; }

.elv\.cta\.strip--split .elv\.cta\.strip\.inner{
  text-align:left;
  display:grid;
  grid-template-columns:1fr;
  gap:36px;
  align-items:center;
}
.elv\.cta\.strip\.contact{
  display:flex;
  flex-direction:column;
  gap:10px;
  font-family:var(--font-head);
  font-size:.92rem;
}
.elv\.cta\.strip\.contact a{ text-decoration:none; color:var(--site-text); }

.elv\.cta\.strip--card .elv\.cta\.strip\.inner{
  background:var(--site-surface);
  border:1px solid var(--elv-line-strong);
  padding:56px var(--pad-side);
  max-width:680px;
  margin:0 auto;
}

/* ---------------------------------- SELF CHECK ---------------------------------- */
.elv\.check\.list{ display:grid; gap:14px; max-width:680px; }
.elv\.check\.item{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:18px 22px;
  background:var(--site-surface);
  border:1px solid var(--elv-line-strong);
}
.elv\.check\.box{
  flex:none;
  width:22px; height:22px;
  border:2px solid var(--site-text);
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  cursor:pointer;
  margin-top:2px;
}
.elv\.check\.box:checked{ background:var(--site-accent); border-color:var(--site-accent); }
.elv\.check\.box:checked::after{
  content:"";
  position:absolute;
  left:6px; top:2px;
  width:5px; height:10px;
  border:solid #F7F6EF;
  border-width:0 2px 2px 0;
  transform:rotate(40deg);
}
.elv\.check\.label{ font-size:1rem; line-height:1.6; padding-top:1px; }
.elv\.check\.verdict{
  margin-top:40px;
  max-width:680px;
  padding:32px;
  border:1px solid var(--site-accent);
  background:var(--elv-olive);
}
.elv\.check\.verdict\.title{
  font-family:var(--font-head);
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--site-accent);
  margin-bottom:10px;
}

/* ---------------------------------- PROCESS (4 steps) ---------------------------------- */
.elv\.process\.row{
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
}
.elv\.process\.step{
  border-top:1px solid var(--elv-line-strong);
  padding-top:22px;
}
.elv\.process\.step\.num{
  font-family:var(--font-head);
  font-size:1.6rem;
  color:var(--site-accent2);
  display:block;
  margin-bottom:14px;
}
.elv\.process\.step\.title{ font-size:1.1rem; margin-bottom:10px; }
.elv\.process\.step\.text{ color:var(--site-muted); font-size:.95rem; line-height:1.7; }

/* ---------------------------------- FAQ ACCORDION ---------------------------------- */
.elv\.faq\.group{ border-top:1px solid var(--elv-line-strong); }
.elv\.faq\.item{ border-bottom:1px solid var(--elv-line-strong); }
.elv\.faq\.head{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:24px 2px;
  text-align:left;
  font-family:var(--font-head);
  font-size:1rem;
  letter-spacing:.01em;
}
.elv\.faq\.head i{ color:var(--site-accent); transition:transform .25s ease; flex:none; }
.elv\.faq\.item.is-open .elv\.faq\.head i{ transform:rotate(45deg); }
.elv\.faq\.body{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
}
.elv\.faq\.item.is-open .elv\.faq\.body{ max-height:600px; }
.elv\.faq\.body\.inner{
  padding:0 2px 26px;
  color:var(--site-muted);
  line-height:1.75;
  max-width:70ch;
}

/* ---------------------------------- CHECKLIST ---------------------------------- */
.elv\.checklist\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
}
.elv\.checklist\.item{ display:flex; gap:16px; align-items:flex-start; }
.elv\.checklist\.mark{
  flex:none;
  width:26px; height:26px;
  border:2px solid var(--site-accent);
  display:grid;
  place-items:center;
  color:var(--site-accent);
  font-size:.75rem;
}
.elv\.checklist\.title{ font-size:1.05rem; margin-bottom:6px; }
.elv\.checklist\.desc{ color:var(--site-muted); font-size:.92rem; line-height:1.65; }

/* ---------------------------------- CASE STUDY (three-act) ---------------------------------- */
.elv\.case\.acts{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border-top:1px solid var(--elv-line-strong);
}
.elv\.case\.act{
  padding:32px 0;
  border-bottom:1px solid var(--elv-line-strong);
}
.elv\.case\.act\.label{
  font-family:var(--font-head);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--site-accent2);
  margin-bottom:14px;
}
.elv\.case\.act\.title{ font-size:1.25rem; margin-bottom:12px; }
.elv\.case\.act\.text{ color:var(--site-muted); line-height:1.75; }

/* ---------------------------------- METHODOLOGY ---------------------------------- */
.elv\.method\.list{ display:grid; gap:0; }
.elv\.method\.phase{
  display:grid;
  grid-template-columns:70px 1fr;
  gap:24px;
  padding:36px 0;
  border-top:1px solid var(--elv-line-strong);
}
.elv\.method\.phase:first-child{ border-top:none; padding-top:0; }
.elv\.method\.phase\.num{
  font-family:var(--font-head);
  font-size:1.4rem;
  color:var(--site-accent);
}
.elv\.method\.phase\.title{ font-size:1.15rem; margin-bottom:10px; }
.elv\.method\.phase\.text{ color:var(--site-muted); line-height:1.75; max-width:64ch; }

/* ---------------------------------- CREDENTIALS ---------------------------------- */
.elv\.creds\.list{ border-top:1px solid var(--elv-line-strong); }
.elv\.creds\.item{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding:20px 0;
  border-bottom:1px solid var(--elv-line-strong);
}
.elv\.creds\.name{ font-size:1rem; }
.elv\.creds\.year{
  font-family:var(--font-head);
  font-size:.85rem;
  color:var(--site-muted);
  flex:none;
}

/* ---------------------------------- METRICS PANEL ---------------------------------- */
.elv\.metrics\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:48px;
}
.elv\.metrics\.col\.heading{
  font-family:var(--font-head);
  font-size:.75rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--site-accent);
  margin-bottom:20px;
}
.elv\.metrics\.item{
  padding:16px 0;
  border-bottom:1px solid var(--elv-line);
}
.elv\.metrics\.item\.title{ font-size:.98rem; margin-bottom:4px; }
.elv\.metrics\.item\.text{ color:var(--site-muted); font-size:.88rem; line-height:1.6; }

/* ---------------------------------- CONTACT FORM ---------------------------------- */
.elv\.contact\.grid{
  display:grid;
  grid-template-columns:1fr;
  gap:48px;
}
.elv\.contact\.info\.title{ font-size:1.4rem; margin-bottom:16px; }
.elv\.contact\.info\.text{ color:var(--site-muted); line-height:1.8; max-width:44ch; }

.elv\.form\.field{ display:flex; flex-direction:column; gap:8px; margin-bottom:22px; }
.elv\.form\.label{
  font-family:var(--font-head);
  font-size:.75rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--site-muted);
}
.elv\.form\.input,
.elv\.form\.textarea{
  border:1px solid var(--elv-line-strong);
  background:var(--site-surface);
  padding:14px 16px;
  font-size:1rem;
  color:var(--site-text);
  transition:border-color .2s ease;
}
.elv\.form\.input:focus,
.elv\.form\.textarea:focus{ border-color:var(--site-accent); outline:none; }
.elv\.form\.textarea{ min-height:150px; resize:vertical; }
.elv\.form\.field--error .elv\.form\.input,
.elv\.form\.field--error .elv\.form\.textarea{ border-color:var(--elv-error); }
.elv\.form\.note--error{ color:var(--elv-error); font-size:.82rem; }
.elv\.form\.note{ color:var(--site-muted); font-size:.82rem; }

.elv\.contact\.details{
  grid-column:1/-1;
  margin-top:12px;
  padding-top:36px;
  border-top:1px solid var(--elv-line-strong);
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
}
.elv\.contact\.details\.label{
  font-family:var(--font-head);
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--site-accent);
  margin-bottom:8px;
}
.elv\.contact\.details\.value{ font-size:.95rem; line-height:1.6; color:var(--site-text); }
.elv\.contact\.details\.value a{ text-decoration:none; }

/* ---------------------------------- CARD STAT ---------------------------------- */
.elv\.card\.stat{
  padding:30px;
  border:1px solid var(--elv-line-strong);
  background:var(--site-surface);
}
.elv\.card\.stat\.num{
  font-family:var(--font-head);
  font-size:2.4rem;
  color:var(--site-accent);
  display:block;
  margin-bottom:8px;
}
.elv\.card\.stat\.label{
  font-size:.85rem;
  color:var(--site-muted);
  letter-spacing:.03em;
}

/* ---------------------------------- ACCORDION (generic, shared with FAQ rules above) ---------------------------------- */
[data-toggle-group] [data-panel] [data-fold-head]{ width:100%; cursor:pointer; }

/* ---------------------------------- SWIPER ---------------------------------- */
.reel-pk5{ padding-bottom:52px; }
.reel-pk5 .swiper-slide{
  height:auto;
  background:var(--site-surface);
  border:1px solid var(--elv-line-strong);
}
.reel-pk5 .swiper-pagination-bullet{
  background:var(--site-muted);
  opacity:.5;
  width:8px; height:8px;
  border-radius:0;
}
.reel-pk5 .swiper-pagination-bullet-active{
  background:var(--site-accent);
  opacity:1;
}
.reel-pk5 .swiper-button-prev,
.reel-pk5 .swiper-button-next{
  width:44px; height:44px;
  background:var(--site-surface);
  border:1px solid var(--elv-line-strong);
  color:var(--site-text);
  top:40%;
}
.reel-pk5 .swiper-button-prev::after,
.reel-pk5 .swiper-button-next::after{ font-size:16px; }

/* ---------------------------------- MODAL (scroll-safe) ---------------------------------- */
.popup-l7s{
  position:fixed;
  inset:0;
  z-index:300;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease;
}
.popup-l7s.is-open{ opacity:1; visibility:visible; }
.elv\.modal\.backdrop{
  position:absolute;
  inset:0;
  background:rgba(35,40,31,.6);
}
.elv\.modal\.dialog{
  position:relative;
  z-index:2;
  max-width:520px;
  width:100%;
  max-height:86vh;
  overflow-y:auto;
  background:var(--site-surface);
  border:1px solid var(--elv-line-strong);
  padding:44px 36px;
  transform:translateY(10px);
  transition:transform .25s ease;
}
.popup-l7s.is-open .elv\.modal\.dialog{ transform:translateY(0); }
.elv\.modal\.close{
  position:absolute;
  top:14px; right:14px;
  width:34px; height:34px;
  border:1px solid var(--elv-line-strong);
  display:grid; place-items:center;
  font-size:1.1rem;
}
.elv\.modal\.title{ font-size:1.3rem; margin-bottom:14px; }
.elv\.modal\.text{ color:var(--site-muted); line-height:1.75; }

/* ---------------------------------- MISC GRIDS / IMAGE WRAPPERS ---------------------------------- */
.elv\.img\.wrap{ overflow:hidden; background:var(--elv-olive); }
.elv\.img\.wrap img{ display:block; width:100%; height:100%; object-fit:cover; }
.elv\.img\.wrap--wide{ aspect-ratio:16/9; }
.elv\.img\.wrap--tall{ aspect-ratio:3/4; }
.elv\.img\.wrap--square{ aspect-ratio:1/1; }

/* ---------------------------------- AOS TUNING (subtle, low intensity) ---------------------------------- */
[data-aos]{ transition-timing-function: ease-out !important; }

/* ---------------------------------- RESPONSIVE ---------------------------------- */
@media (min-width:640px){
  .elv\.gallery\.grid{ grid-template-columns:repeat(2,1fr); }
  .elv\.checklist\.grid{ grid-template-columns:repeat(2,1fr); }
  .elv\.process\.row{ grid-template-columns:repeat(2,1fr); }
}

@media (min-width:768px){
  .elv\.header\.utility\.reg{ display:flex; }
  .elv\.nav{ display:flex; }
  .elv\.nav\.toggle{ display:none; }

  .elv\.page-hero\.grid{ grid-template-columns:1fr; }
  .elv\.page-hero--split .elv\.page-hero\.grid{ grid-template-columns:1.05fr 1fr; }

  .elv\.compare\.grid{ grid-template-columns:1.1fr 1fr; }
  .elv\.reasons\.grid{ grid-template-columns:repeat(3,1fr); }
  .elv\.persona\.item{ grid-template-columns:320px 1fr; gap:56px; }
  .elv\.persona\.item:nth-child(even) .elv\.persona\.media{ order:2; }
  .elv\.gallery\.grid{ grid-template-columns:repeat(3,1fr); }
  .elv\.process\.row{ grid-template-columns:repeat(4,1fr); }
  .elv\.checklist\.grid{ grid-template-columns:repeat(2,1fr); gap:32px 56px; }
  .elv\.case\.acts{ grid-template-columns:repeat(3,1fr); border-top:none; }
  .elv\.case\.act{ border-bottom:none; border-left:1px solid var(--elv-line-strong); padding:0 32px; }
  .elv\.case\.act:first-child{ border-left:none; padding-left:0; }
  .elv\.method\.phase{ grid-template-columns:90px 1fr; }
  .elv\.metrics\.grid{ grid-template-columns:1fr 1fr; }
  .elv\.contact\.grid{ grid-template-columns:1fr 1.1fr; }
  .elv\.contact\.details{ grid-template-columns:repeat(3,1fr); }
  .elv\.cta\.strip--split .elv\.cta\.strip\.inner{ grid-template-columns:1.4fr 1fr; }

  .elv\.footer\.inner{ grid-template-columns:1.3fr 1fr 1fr 1fr; }
}

@media (min-width:1200px){
  .elv\.hero\.title--lg{ font-size:4.6rem; }
  .elv\.page-hero--split .elv\.page-hero\.grid{ gap:72px; }
}

@media (max-width:767px){
  .elv\.header\.utility\.reg{ display:none; }
  .elv\.footer\.inner{ grid-template-columns:1fr 1fr; }
  .elv\.footer\.brand{ grid-column:1/-1; }
}

@media (max-width:479px){
  .elv\.footer\.inner{ grid-template-columns:1fr; }
  .elv\.header\.utility\.item span{ display:none; }
}


/* --- cookie consent (per-site) --- */
.cookie-bar-tqj-overlay{position:fixed;inset:0;opacity:0;visibility:hidden;transition:.25s;z-index:9998;}
.cookie-bar-tqj-overlay.is-open{opacity:1;visibility:visible;}
.cookie-bar-tqj-panel{position:fixed;background:var(--site-surface,#fff);color:var(--site-text,#1a1a1a);
  box-shadow:0 20px 60px rgba(0,0,0,.28);padding:24px;opacity:0;visibility:hidden;transition:.25s;z-index:9999;}
.cookie-bar-tqj-panel.is-open{opacity:1;visibility:visible;}
.cookie-bar-tqj-panel h3{margin:0 0 8px;font-size:1.2rem;}
.cookie-bar-tqj-panel>p{margin:0 0 16px;color:var(--site-muted,#666);font-size:.95rem;}
.cookie-bar-tqj-cat{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid rgba(128,128,128,.2);}
.cookie-bar-tqj-cat h4{margin:0 0 2px;font-size:.98rem;}
.cookie-bar-tqj-cat p{margin:0;color:var(--site-muted,#777);font-size:.85rem;}
.cookie-bar-tqj-switch{position:relative;flex:0 0 auto;width:44px;height:24px;}
.cookie-bar-tqj-switch input{opacity:0;width:0;height:0;position:absolute;}
.cookie-bar-tqj-switch span{position:absolute;inset:0;background:#c9c9c9;border-radius:999px;transition:.2s;cursor:pointer;}
.cookie-bar-tqj-switch span::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.cookie-bar-tqj-switch input:checked+span{background:var(--site-accent,#2b7);}
.cookie-bar-tqj-switch input:checked+span::before{transform:translateX(20px);}
.cookie-bar-tqj-switch input:disabled+span{opacity:.6;cursor:not-allowed;}
.cookie-bar-tqj-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.cookie-bar-tqj-actions button{flex:1;min-width:140px;padding:11px 16px;border:none;border-radius:10px;font:inherit;font-weight:600;cursor:pointer;}
.cookie-bar-tqj-actions #cookie-bar-tqj-all{background:var(--site-accent,#2b7);color:#fff;}
.cookie-bar-tqj-actions #cookie-bar-tqj-save{background:transparent;color:var(--site-text,#222);border:1px solid rgba(128,128,128,.4);}
.cookie-bar-tqj-links{display:flex;gap:16px;margin-top:14px;font-size:.85rem;}
.cookie-bar-tqj-links a{color:var(--site-accent,#2b7);text-decoration:underline;}
.cookie-bar-tqj-trigger{position:fixed;left:18px;bottom:18px;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;
  background:var(--site-surface,#fff);color:var(--site-accent,#2b7);box-shadow:0 6px 18px rgba(0,0,0,.2);z-index:9997;font-size:1.1rem;}

.cookie-bar-tqj-overlay{background:transparent;pointer-events:none;}
.cookie-bar-tqj-panel{left:24px;bottom:24px;width:min(380px,calc(100% - 32px));border-radius:16px;transform:translateY(24px);}
.cookie-bar-tqj-panel.is-open{transform:translateY(0);}
@media(max-width:520px){.cookie-bar-tqj-panel{left:16px;right:16px;width:auto;}}
@media(max-width:520px){.cookie-bar-tqj-actions button{min-width:100%;}}
#action-dock-vw9{left:auto !important;right:18px !important;}
@media(max-width:520px){#action-dock-vw9{right:12px !important;}}


/* --- safety net (deterministic) --- */
*,*::before,*::after{box-sizing:border-box;}
html,body{overflow-x:hidden;overflow-x:clip;max-width:100%;}
img,svg,video,iframe,canvas{max-width:100%;}
table{max-width:100%;}
/* simpleParallax оборачивает <img> в свой .simpleParallax — заставляем обёртку
   тянуться на всю высоту родителя, а фото внутри — cover. Проценты безопасны:
   при родителе без заданной высоты height:100% откатывается к auto (без коллапса). */
.simpleParallax{display:block;width:100%;height:100%;}
.simpleParallax img{width:100%;height:100%;object-fit:cover;}
/* Браузерный дефолт для <blockquote> и <figure> — margin: 1em 40px. Модель берёт
   эти семантические теги для отзывов и карточек с подписью, но сбросить поля
   забывает: внутри карточки в 267px текст сжимался до 131px (по 40px с каждой
   стороны) и переносился по одному слову, а между карточками зияли пустоты.
   Сбрасываем только горизонтальные поля — вертикальные обычно задуманы. */
blockquote, figure { margin-left: 0; margin-right: 0; }
/* Вложенные фигуры внутри сеток тоже не должны добавлять отступ сбоку. */
figure > blockquote, figure > figcaption { margin-left: 0; margin-right: 0; }
/* Если AOS не поднялся (CDN недоступен, блокировщик) — main.js вешает .no-aos.
   Без этого элементы с data-aos остались бы с opacity:0 из aos.css, то есть
   половина страницы была бы невидимой. */
html.no-aos [data-aos]{opacity:1 !important;transform:none !important;}
/* Пользователи с prefers-reduced-motion получают контент сразу, без анимаций. */
@media(prefers-reduced-motion:reduce){
  [data-aos]{opacity:1 !important;transform:none !important;transition:none !important;}
}
