/* Elvora Fenestra - custom content blocks (offer / systems / about).
   Scoped to .elvora-* classes so nothing in the mirrored theme is affected. */

.elvora-sec {
  padding: 64px 0;
  background: #fff;
  font-family: inherit;
}
.elvora-sec.elvora-sec-alt { background: #f6f7f9; }

.elvora-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

.elvora-eyebrow {
  display: block;
  text-align: center;
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #1955FF;
  margin: 0 0 10px;
  font-weight: 600;
}

.elvora-title {
  text-align: center;
  font-size: 36px;
  line-height: 1.2;
  margin: 0 0 14px;
  color: #313131;
  font-weight: 700;
}

.elvora-lead {
  text-align: center;
  font-size: 18px;
  line-height: 1.7;
  color: #5b6472;
  max-width: 860px;
  margin: 0 auto 44px;
}

.elvora-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 28px;
  align-items: stretch;
}
.elvora-grid-2 { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }

.elvora-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e6e8ec;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(20, 30, 60, .04);
  transition: box-shadow .25s ease, transform .25s ease;
}
.elvora-card:hover { box-shadow: 0 12px 28px rgba(20, 30, 60, .10); transform: translateY(-2px); }

.elvora-media { position: relative; background: #eef0f3; }
.elvora-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.elvora-body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1 1 auto; }

.elvora-card h3 {
  font-size: 20px;
  line-height: 1.3;
  margin: 0 0 10px;
  color: #1955FF;
  font-weight: 700;
}
.elvora-card p {
  font-size: 15px;
  line-height: 1.68;
  color: #4b5563;
  margin: 0 0 12px;
}
.elvora-specs {
  margin: 2px 0 14px;
  padding: 0;
  list-style: none;
  font-size: 14px;
  line-height: 1.9;
  color: #4b5563;
}
.elvora-specs li { position: relative; padding-left: 20px; }
.elvora-specs li:before {
  content: "";
  position: absolute;
  left: 0; top: 9px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #1955FF;
}
.elvora-colors {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px dashed #e6e8ec;
  font-size: 14px;
  line-height: 1.6;
  color: #6b7280;
}
.elvora-colors strong { color: #313131; }

.elvora-about { display: grid; grid-template-columns: 1.35fr 1fr; gap: 40px; align-items: start; }
.elvora-about p.elvora-about-lead {
  font-size: 19px;
  line-height: 1.75;
  color: #3b4351;
  margin: 0 0 18px;
}
.elvora-about p { font-size: 16px; line-height: 1.75; color: #5b6472; margin: 0 0 14px; }
.elvora-points { list-style: none; margin: 0; padding: 0; }
.elvora-points li {
  padding: 16px 0 16px 34px;
  border-top: 1px solid #e6e8ec;
  position: relative;
  font-size: 16px;
  color: #313131;
  font-weight: 600;
}
.elvora-points li:first-child { border-top: 0; padding-top: 4px; }
.elvora-points li:before {
  content: "\2713";
  position: absolute;
  left: 0; top: 15px;
  color: #1955FF;
  font-weight: 700;
}
.elvora-points li:first-child:before { top: 3px; }
.elvora-points span { display: block; font-size: 14px; font-weight: 400; color: #6b7280; margin-top: 4px; }
.elvora-cta {
  display: inline-block;
  margin-top: 22px;
  padding: 14px 28px;
  background: #1955FF;
  color: #fff !important;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s ease;
}
.elvora-cta:hover { background: #1342c9; }

@media only screen and (max-width: 980px) {
  .elvora-about { grid-template-columns: 1fr; gap: 24px; }
  .elvora-title { font-size: 30px; }
  .elvora-sec { padding: 48px 0; }
}
@media only screen and (max-width: 600px) {
  .elvora-title { font-size: 26px; }
  .elvora-lead { font-size: 16px; }
  .elvora-eyebrow { font-size: 12px; }
  .elvora-grid { gap: 20px; }
  .elvora-sec { padding: 40px 0; }
}

/* ============================================================
   Client round 1 - logo, WhatsApp, phone, warranty, contact, Ilfov visibility.
   Appended last so these win against the mirrored theme rules.
   ============================================================ */

/* 1. The "we also work in Ilfov" line was white-on-white: the theme sets the action bar
      background to #fff while .contact_details inherits rgba(255,255,255,.5). */
#Action_bar {
  background-color: #10141c !important;
}
#Action_bar .contact_details,
#Action_bar .contact_details li,
#Action_bar .contact_details .slogan {
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
#Action_bar .contact_details .slogan {
  font-weight: 600;
  letter-spacing: .06em;
}
#Action_bar a,
#Action_bar .menu-action-bar-container a,
#Action_bar #menu-action-bar a {
  color: #ffffff !important;
}
#Action_bar #menu-action-bar li > a:hover { color: #ffd24a !important; }

/* one row: slogan + invoice/warranty + phone + WhatsApp. The theme puts its own
   action menu in the header row where it collides with the nav, so that menu is dropped. */
#Action_bar .contact_details {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 22px;
  float: none !important;
  width: 100%;
  padding: 12px 20px !important;
}
#Action_bar #social-menu,
#Action_bar #menu-action-bar { display: none !important; }
#Action_bar .contact_details li { padding: 0 !important; margin: 0 !important; }
#Action_bar .elvora-tel-item a,
#Action_bar .elvora-wa-item a { font-weight: 600; white-space: nowrap; }
#Action_bar .elvora-tel-item .icon-call { color: #1955FF; margin-right: 4px; }

#Action_bar .elvora-trustline {
  display: inline-flex;
  align-items: center;
  margin-left: 0;
  color: #ffffff !important;
  font-weight: 600;
  letter-spacing: .04em;
}
#Action_bar .elvora-trustdot {
  display: inline-block;
  width: 7px; height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #35d07f;
  box-shadow: 0 0 0 3px rgba(53, 208, 127, .25);
  vertical-align: 1px;
}
#Action_bar .elvora-trustsep { margin: 0 8px; opacity: .55; }

/* WhatsApp item in the top bar */
#Action_bar .elvora-wa-item a { font-weight: 600; white-space: nowrap; }

/* 2. Header logo: let it breathe at the new size, and never distort it */
#Top_bar .logo img,
.header_placeholder .logo img,
.logo img {
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  image-rendering: auto;
}
#Top_bar .logo a,
#logo { display: inline-flex; align-items: center; }

/* 3. Floating WhatsApp button */
.elvora-wa-float {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px 10px 12px;
  border-radius: 999px;
  background: #25D366;
  color: #08240f !important;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .3);
  text-decoration: none !important;
}
.elvora-wa-float svg { fill: #fff !important; width: 22px; height: 22px; }
.elvora-wa-float:hover { background: #1ebe5b; color: #04170a !important; }
.elvora-wa-label { white-space: nowrap; }
.elvora-wa-ring {
  position: absolute; inset: 0;
  border-radius: 999px;
  box-shadow: 0 0 0 0 rgba(37, 211, 102, .7);
  animation: elvora-wa-pulse 2.6s infinite;
  pointer-events: none;
}
@keyframes elvora-wa-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(37, 211, 102, .55); }
  70%  { box-shadow: 0 0 0 16px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}
@media (max-width: 700px) {
  .elvora-wa-float { right: 12px; bottom: 12px; padding: 12px; }
  .elvora-wa-label { display: none; }
}

/* 4. Contact details block (email, WhatsApp, address) on the dark contact band */
.elvora-contactinfo {
  margin: 18px auto 0;
  text-align: center;
  color: #ecedf0;
  font-size: 17px;
  line-height: 1.9;
}
.elvora-contactinfo a {
  color: #ffffff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, .35);
}
.elvora-contactinfo a:hover { color: #ffd24a; border-bottom-color: #ffd24a; }
.elvora-contactinfo .elvora-ico { margin-right: 6px; color: #1955FF; }

/* 5. Footer: logo + contact lines */
.elvora-foot {
  margin: 0 0 18px;
  text-align: center;
}
.elvora-foot img { display: inline-block; margin: 0 auto 12px; }
.elvora-foot p { margin: 4px 0; color: #cfd6e2; font-size: 15px; }
.elvora-foot a { color: #ffffff; text-decoration: none; }
.elvora-foot a:hover { color: #ffd24a; }
.elvora-foot-trust { color: #35d07f !important; font-weight: 600; }

/* floating call button - the phone number stays one tap away where the theme hides its top bar */
.elvora-call-float {
  position: fixed;
  right: 18px;
  bottom: 74px;
  z-index: 9998;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  background: #1955FF;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .3);
}
.elvora-call-float:hover { background: #0b3fd0; color: #fff !important; }
@media (max-width: 700px) {
  .elvora-call-float { right: 12px; bottom: 68px; padding: 12px; }
  .elvora-call-label { display: none; }
}

/* the sticky header must not sit on top of a section we jump to, nor on the contact block's first line */
[id] { scroll-margin-top: 92px; }
#contact { padding-top: 96px !important; }
#contact .elvora-contactinfo p { color: #f4f7fb !important; font-weight: 500; }

/* The mirrored theme paints body copy rgb(98,98,98) - fine on its light pages, unreadable on the dark
   contact band, and that is the client's "nu se vede luminos" on the Ilfov list. Lift every paragraph,
   list and span in that section to a light tone; the numbered .highlight chips stay as they are. */
#contact .column_attr,
#contact .column_attr p,
#contact .column_attr p.big,
#contact .column_attr p a,
#contact .column_attr li,
#contact .column_attr span:not(.highlight) {
  color: #e9edf4 !important;
}
#contact .column_attr p.big { font-weight: 400; }
#contact .column_attr .highlight { color: #ffffff !important; }

/* ============================================================
   Bigger logo in the header. The theme caps the top bar at 60px, which is what held the
   mark at 58px tall; the bar (and the sticky bar) are raised so an 84px logo fits with
   air around it, and the bar is pushed below the action line instead of under it.
   ============================================================ */
@media (min-width: 769px) {
  #Action_bar { position: relative; }
  #Top_bar { top: 74px !important; }                 /* sit under the action line, not through it */
  #Top_bar, #Top_bar > .container, #Top_bar .column, #Top_bar .menu_wrapper { height: 94px; }
  #Top_bar .column, #Top_bar .top_bar_left { align-items: center; }
  /* the theme pins #logo at 60px and caps the image at 100% of it (with !important on
     img[height]) - match its specificity so the bigger mark actually renders */
  #Top_bar .logo, #Top_bar #logo { display: flex; align-items: center; height: 94px; }
  #Top_bar #logo { height: 84px; line-height: 84px; padding: 0; }
  #Top_bar #logo img,
  #Top_bar #logo img[height],
  #Top_bar .logo img { max-height: 84px !important; width: auto; }
  #Top_bar #menu-main-menu > li > a { height: 94px; display: flex; align-items: center; line-height: normal; }
  #Top_bar.is-sticky, #Top_bar.is-sticky > .container, #Top_bar.is-sticky .column,
  #Top_bar.is-sticky .menu_wrapper { height: 94px; }
  #Top_bar.is-sticky #logo { height: 84px; line-height: 84px; }
  #Top_bar.is-sticky #logo img { max-height: 84px !important; }
  #Top_bar.is-sticky #menu-main-menu > li > a { height: 94px; }
}
@media (max-width: 768px) {
  #Top_bar, #Top_bar > .container, #Top_bar .column { height: 78px; }
  #Top_bar .logo, #Top_bar #logo { display: flex; align-items: center; }
  #Top_bar #logo img { margin-left: 12px !important; }   /* the theme out-specifies padding on .logo */
  #Top_bar #logo { height: 68px; line-height: 68px; padding: 0; }
  #Top_bar #logo img, #Top_bar #logo img[height] { max-height: 68px !important; width: auto; }
}