:root{--vz-ink:#1E1238}
/* VZ Reskin BASE — modelul vizofia.ro/ghid-miopie, scopat sub body.vzskin-on #content */

@font-face {
  font-family: 'vizofia-bold';
  src: url('../vizofia-fonts/383Vizofia-Bold.woff2') format('woff2'),
       url('../vizofia-fonts/383Vizofia-Bold.woff') format('woff');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- Fundal de pagina: textura bg5 de pe site-ul original ---------- */
body.vzskin-on #content {
  background-color: #F7F7F7 !important;
  background-image: url('bg5.png') !important;
  background-repeat: repeat !important;
  background-position: top left !important;
  background-size: auto !important;
}

/* ---------- Tipografie (referinta positiveimpact.co.uk: titluri Poppins 700, body Hind 18px) ---------- */
body.vzskin-on #content,
body.vzskin-on #content p,
body.vzskin-on #content li,
body.vzskin-on #content .elementor-widget-text-editor,
body.vzskin-on #content .elementor-widget-text-editor * ,
body.vzskin-on #content .elementor-button,
body.vzskin-on #content input,
body.vzskin-on #content textarea,
body.vzskin-on #content select {
  font-family: 'Hind', sans-serif !important;
}
body.vzskin-on #content p,
body.vzskin-on #content .elementor-widget-text-editor p,
body.vzskin-on #content .elementor-widget-text-editor li {
  font-size: 18px !important;
  line-height: 28px !important;
}
body.vzskin-on #content h1,
body.vzskin-on #content h2 {
  font-family: Poppins, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
body.vzskin-on #content h1 { font-size: clamp(32px, 4.2vw, 50px) !important; line-height: 1.2 !important; }
body.vzskin-on #content h2 { font-size: clamp(26px, 3vw, 36px) !important; line-height: 1.28 !important; }
body.vzskin-on #content h3 { font-family: Poppins, sans-serif !important; font-size: clamp(22px, 2.5vw, 30px) !important; font-weight: 700 !important; line-height: 1.33 !important; }
body.vzskin-on #content h4,
body.vzskin-on #content h5 { font-family: Poppins, sans-serif !important; font-weight: 700 !important; }

/* eyebrow-urile uppercase raman mici, DM Sans */
body.vzskin-on #content h1[style*='letter-spacing'],
body.vzskin-on #content h2[style*='letter-spacing'] { font-size: inherit !important; }

/* ---------- Butoane: pill 150px, #C589FA, uppercase (exact ca pe ghid) ---------- */
body.vzskin-on #content .elementor-button,
body.vzskin-on #content a.elementor-button,
body.vzskin-on #content button[type='submit'],
body.vzskin-on #content .wpforms-submit {
  border-radius: 150px !important;
  background-color: #2F1B54 !important;
  color: #FFFFFF !important;
  border: 1px solid #C589FA !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-family: 'Hind', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 13px 31px !important;
  box-shadow: none !important;
  transition: background-color .25s ease, border-color .25s ease !important;
}
body.vzskin-on #content .elementor-button:hover,
body.vzskin-on #content a.elementor-button:hover,
body.vzskin-on #content button[type='submit']:hover,
body.vzskin-on #content .wpforms-submit:hover {
  background-color: #C588FA !important;
  border-color: #C588FA !important;
  color: #2F174C !important;
}

/* wrapperele butoanelor nu au voie sa aiba fundal propriu (dreptunghi inchis in spatele pill-ului) */
body.vzskin-on #content .elementor-widget-button,
body.vzskin-on #content .elementor-widget-button > .elementor-widget-container,
body.vzskin-on #content .elementor-button-wrapper {
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* ---------- Perechi de butoane: primul plin, al doilea outline (ca pe ghid) ---------- */
body.vzskin-on #content .elementor-widget-button + .elementor-widget-button .elementor-button {
  background-color: transparent !important;
  color: #2F1154 !important;
  border: 1px solid #C589FA !important;
}
body.vzskin-on #content .elementor-widget-button + .elementor-widget-button .elementor-button:hover {
  background-color: #C589FA !important;
  color: #2F1154 !important;
}
/* in hero (sectiune cu h1, fundal gradient) varianta outline e alba */
body.vzskin-on #content .e-con:has(h1) .elementor-widget-button + .elementor-widget-button .elementor-button,
body.vzskin-on #content .elementor-section:has(h1) .elementor-widget-button + .elementor-widget-button .elementor-button {
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
  background-color: transparent !important;
}
body.vzskin-on #content .e-con:has(h1) .elementor-widget-button + .elementor-widget-button .elementor-button:hover,
body.vzskin-on #content .elementor-section:has(h1) .elementor-widget-button + .elementor-widget-button .elementor-button:hover {
  background-color: #FFFFFF !important;
  color: #2F1154 !important;
}

/* butonul-expander de pe homepage (Vezi toate nevoile): outline lila, pill */
body.vzskin-on #content .vz-need-more button {
  border-color: rgba(197, 137, 250, .7) !important;
  color: #2F1154 !important;
  border-radius: 150px !important;
  background: transparent !important;
  font-family: 'Hind', sans-serif !important;
}
body.vzskin-on #content .vz-need-more button:hover {
  background: #C589FA !important;
  color: #2F1154 !important;
  border-color: #C589FA !important;
}

/* ---------- Carduri: albe, radius 16, fara umbre (ghid = flat) ---------- */
body.vzskin-on #content .lhs-card,
body.vzskin-on #content .vzdn .c,
body.vzskin-on #content .vzls a.c,
body.vzskin-on #content .vzdnb,
body.vzskin-on #content .vztr {
  border-radius: 16px !important;
}
body.vzskin-on #content .vztr,
body.vzskin-on #content .vzdnb {
  background: #FFFFFF !important;
  border-color: rgba(197, 137, 250, .45) !important;
}
body.vzskin-on #content .vzdn .day { border-color: rgba(197, 137, 250, .45) !important; }
body.vzskin-on #content .vzdn .night { background-color: #2F1154 !important; }
body.vzskin-on #content .vz-grabber-hero-card { border-radius: 16px !important; background-color: #2F1154 !important; }

/* ---------- Animatii de intrare (uncode bottom-t-top, stagger) ---------- */
body.vzskin-on .vz-anim {
  opacity: .35;
  transform: translateY(20px);
  transition: opacity .45s cubic-bezier(.35, .81, .41, 1), transform .45s cubic-bezier(.35, .81, .41, 1);
  will-change: opacity, transform;
}
body.vzskin-on .vz-anim.vz-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  body.vzskin-on .vz-anim { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ---------- CTA final „Programeaza o evaluare" — exact ca pe ghid: titlu 70px negru, centrat, caret ^ lila ---------- */
body.vzskin-on #content .elementor-3988 .elementor-element.elementor-element-a9fbb6a .elementor-heading-title,
body.vzskin-on #content .elementor-3279 .elementor-element.elementor-element-f9b380a .elementor-heading-title,
body.vzskin-on #content .elementor-3278 .elementor-element.elementor-element-929fa15 .elementor-heading-title,
body.vzskin-on #content .elementor-3277 .elementor-element.elementor-element-bc6bcf1 .elementor-heading-title,
body.vzskin-on #content .elementor-3276 .elementor-element.elementor-element-8486150 .elementor-heading-title,
body.vzskin-on #content .elementor-3275 .elementor-element.elementor-element-2bbde79 .elementor-heading-title,
body.vzskin-on #content .elementor-3054 .elementor-element.elementor-element-c6947ef .elementor-heading-title {
  font-size: clamp(36px, 4.2vw, 50px) !important;
  line-height: 1.2 !important;
  text-align: center !important;
  font-family: Poppins, sans-serif !important;
  font-weight: 700 !important;
  /* degrade exact ca pe ghid: mov inchis -> lila deschis */
  color: #2F1154 !important;
  background-image: linear-gradient(to right, #2F1154 0%, #2F1154 35%, #B17BF4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
/* caret-ul ^ (logo-mark Vizofia) centrat deasupra titlului */
body.vzskin-on #content .elementor-3988 .elementor-element.elementor-element-a947548 .elementor-heading-title,
body.vzskin-on #content .elementor-3279 .elementor-element.elementor-element-b0e7fbd .elementor-heading-title,
body.vzskin-on #content .elementor-3278 .elementor-element.elementor-element-6e01904 .elementor-heading-title,
body.vzskin-on #content .elementor-3277 .elementor-element.elementor-element-7e3b5d2 .elementor-heading-title,
body.vzskin-on #content .elementor-3276 .elementor-element.elementor-element-9e4ed0c .elementor-heading-title,
body.vzskin-on #content .elementor-3275 .elementor-element.elementor-element-9c133e5 .elementor-heading-title,
body.vzskin-on #content .elementor-3054 .elementor-element.elementor-element-154117a .elementor-heading-title {
  font-family: 'vizofia-bold', sans-serif !important;
  font-size: 50px !important;
  color: #C589FA !important;
  text-align: center !important;
}
/* inlatura poza cu mana si lentila (Glasses.webp) de deasupra CTA-ului */
body.vzskin-on #content .elementor-3988 .elementor-element.elementor-element-c8c953a,
body.vzskin-on #content .elementor-3277 .elementor-element.elementor-element-74283f3 {
  display: none !important;
}

/* ---------- CTA final homepage (Gaseste un specialist) — acelasi tratament ca CTA-ul de pe ghid ---------- */
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-ee6img1 { display: none !important; }
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-48eabb1 { background-color: transparent !important; }
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-ee6txt1 {
  width: 100% !important;
  max-width: 860px !important;
  margin: 0 auto !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  text-align: center !important;
}
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-4cb3449,
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-60e0139 {
  width: 100% !important;
  flex-basis: 100% !important;
}
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-75d393b,
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-fc52adc {
  width: auto !important;
  margin: 6px 8px 0 8px !important;
}
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-4cb3449 .elementor-heading-title {
  font-size: clamp(36px, 4.2vw, 50px) !important;
  line-height: 1.2 !important;
  text-align: center !important;
  font-family: Poppins, sans-serif !important;
  font-weight: 700 !important;
  color: #2F1154 !important;
  background-image: linear-gradient(to right, #2F1154 0%, #2F1154 35%, #B17BF4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-4cb3449 .elementor-heading-title::before {
  content: '^';
  display: block;
  font-family: 'vizofia-bold', sans-serif;
  font-size: 50px;
  line-height: 1;
  color: #C589FA;
  -webkit-text-fill-color: #C589FA;
  margin-bottom: 12px;
}
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-60e0139,
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-60e0139 p,
body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-60e0139 * {
  text-align: center !important;
}

/* ---------- Hero homepage pe MOBIL: imagine dedicata 4x5 in loc de video ---------- */
@media (max-width: 767px) {
  body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-04d1a8e {
    background-image: url('https://www.lenshub.ro/wp-content/uploads/2026/08/00-homepage-human-clarity-eyes-mobile-4x5-1.png') !important;
    background-size: cover !important;
    background-position: center top !important;
    background-color: #2F1154 !important;
  }
  body.vzskin-on #content .elementor-3045 .elementor-element.elementor-element-04d1a8e .elementor-background-video-container {
    display: none !important;
  }
}

/* (bara de preview eliminata — skin activ in productie) */

/* ---------- Audit UX: chips navigare rapida (tap >=44px) ---------- */
body.vzskin-on #content .vz-quick-band a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 44px !important;
  padding: 8px 18px !important;
  border: 1px solid rgba(197,137,250,.55) !important;
  border-radius: 150px !important;
  background: #FFFFFF !important;
  color: #2F1154 !important;
  transition: background .2s ease, color .2s ease;
}
body.vzskin-on #content .vz-quick-band a:hover,
body.vzskin-on #content .vz-quick-band a:active {
  background: #2F1154 !important;
  color: #FFFFFF !important;
  border-color: #2F1154 !important;
}
body.vzskin-on #content .vz-quick-band > div > div { gap: 10px 12px !important; justify-content: center !important; }

/* ---------- Audit UX: spatii verticale mai mici pe mobil ---------- */
@media (max-width: 767px) {
  body.vzskin-on #content .e-con.e-parent:not(:first-of-type) {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
}

/* ---------- Audit UX: logo-uri branduri la dimensiune uniforma ---------- */
body.vzskin-on #content .elementor-element-051a00c img { max-height: 38px !important; width: auto !important; object-fit: contain; }

/* ---------- Audit UX: in hero un singur CTA dominant, secundarul discret ---------- */
body.vzskin-on #content .e-con:has(h1) .elementor-widget-button + .elementor-widget-button .elementor-button {
  border-color: rgba(255,255,255,.45) !important;
  opacity: .92;
}

/* === VZ 21.08.2026: MEGA-MENIU Gaseste solutia (item 4175) — rafinat pe mockup === */
@media(min-width:1025px){
body.vzskin-on li.menu-item-4175{position:static !important;}
body.vzskin-on li.menu-item-4175 > ul[style*="block"]{display:grid !important;width:min(1200px,94vw) !important;max-width:none !important;min-width:0 !important;overflow:visible !important;}
body.vzskin-on li.menu-item-4175 > ul{grid-template-columns:repeat(4,1fr);gap:0;width:min(1200px,94vw);padding:36px 12px 26px !important;background:#FBFAFE !important;border:1.5px solid #E9E2F4 !important;border-radius:22px !important;box-shadow:0 28px 70px rgba(36,20,65,.16) !important;margin-top:10px !important;}
body.vzskin-on li.menu-item-4175 > ul > li{border:0 !important;padding:0 26px !important;position:relative;min-width:0;overflow:visible !important;}
body.vzskin-on li.menu-item-4175 ul ul li{overflow:visible !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-head + li.vzmm-head::before, body.vzskin-on li.menu-item-4175 > ul > li.vzmm-head ~ li.vzmm-head::before{content:'';position:absolute;left:0;top:6px;bottom:14px;width:1px;background:linear-gradient(180deg,transparent,#E3D9F2 18%,#E3D9F2 82%,transparent);}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-head > a{font-family:Poppins,sans-serif !important;font-size:13px !important;font-weight:600 !important;letter-spacing:.12em;text-transform:uppercase;color:var(--vz-ink) !important;padding:0 0 16px !important;background:transparent !important;cursor:default;pointer-events:none;white-space:normal !important;overflow:visible !important;}
body.vzskin-on li.menu-item-4175 ul ul{position:static !important;display:block !important;opacity:1 !important;visibility:visible !important;transform:none !important;box-shadow:none !important;border:0 !important;padding:0 !important;min-width:0 !important;background:transparent !important;}
body.vzskin-on li.menu-item-4175 ul ul li{border:0 !important;}
body.vzskin-on li.menu-item-4175 ul ul a{font-family:'Hind',sans-serif !important;font-size:15.5px !important;color:#1E293B !important;padding:10px 0 !important;line-height:1.35 !important;background:transparent !important;white-space:normal !important;overflow:visible !important;text-overflow:clip !important;word-break:normal;}
body.vzskin-on li.menu-item-4175 ul ul a:hover{color:#53248C !important;background:transparent !important;text-decoration:underline;text-underline-offset:4px;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta{grid-column:1 / -1;margin:22px 18px 4px;padding:0 !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta::before{display:none !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta > a{display:flex !important;align-items:center;gap:18px;background:#241040 !important;border-radius:18px;padding:16px 16px 16px 26px !important;font-family:Poppins,sans-serif !important;font-size:16px !important;font-weight:700 !important;color:#fff !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta > a:hover{background:#2F1B54 !important;color:#fff !important;}
body.vzskin-on li.menu-item-4175 .vzmm-cta .t2{flex:1;font-family:'Hind',sans-serif;font-weight:400;font-size:15px;color:#EFE6FB;white-space:normal;min-width:0;}
body.vzskin-on li.menu-item-4175 .vzmm-cta .bt{flex:0 0 auto;background:#C588FA;color:#2F174C;border-radius:150px;padding:12px 30px;font-family:'Hind',sans-serif;font-weight:600;font-size:14px;letter-spacing:.04em;text-transform:uppercase;transition:background .2s,color .2s;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta > a:hover .bt{background:#fff;}
}
/* === VZ 21.08.2026: mega-meniul deasupra hero-urilor (stacking) === */
body.vzskin-on .elementor-location-header, body.vzskin-on header, body.vzskin-on .elementor-3445, body.vzskin-on .elementor-3446{position:relative;z-index:9990 !important;}
@media(min-width:1025px){
body.vzskin-on li.menu-item-4175 > ul{z-index:9995 !important;}
body.vzskin-on .elementor-nav-menu--main .elementor-nav-menu--dropdown, body.vzskin-on .elementor-nav-menu--main ul.sub-menu{z-index:9995;}
}

/* mega pe mobil: Gaseste solutia = link simplu, fara cele 18 sub-linkuri */
@media(max-width:1024px){
body.vzskin-on .elementor-nav-menu--dropdown li.menu-item-4175 > ul, body.vzskin-on nav.elementor-nav-menu--dropdown li.menu-item-4175 > ul{display:none !important;}
body.vzskin-on .elementor-nav-menu--dropdown li.menu-item-4175 .sub-arrow{display:none !important;}
}

/* VZ 22.08: rand de jos megameniu + sentence case */
@media(min-width:1025px){
body.vzskin-on li.menu-item-4175 ul ul a, body.vzskin-on li.menu-item-4175 > ul > li.vzmm-link > a{text-transform:none !important;letter-spacing:0 !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-link{grid-column:span 1;margin-top:22px;padding-top:16px !important;border-top:1px solid #E9E2F4 !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-link::before{display:none !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-link > a{display:inline-flex !important;align-items:center;gap:8px;font-family:Poppins,sans-serif !important;font-size:14.5px !important;font-weight:600 !important;color:#2F1154 !important;padding:12px 0 !important;background:transparent !important;white-space:normal !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-link > a:hover{text-decoration:underline;text-underline-offset:4px;}
body.vzskin-on li.menu-item-4175 .vzmm-cart{flex:0 0 18px;width:18px;height:18px;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta{grid-column:3 / -1;margin:22px 18px 0 26px;padding-top:16px !important;border-top:1px solid #E9E2F4 !important;}
body.vzskin-on li.menu-item-4175 > ul > li.vzmm-cta > a{justify-content:space-between;padding:12px 12px 12px 22px !important;border-radius:14px;font-size:15px !important;white-space:nowrap;}
body.vzskin-on li.menu-item-4175 .vzmm-cta .bt{padding:10px 22px;}
}

/* VZ 22.08: icon cos in loc de sageata pentru linkurile catre Vizofia Shop */
i.vz-cart,.vzc-ext:after{content:"";display:inline-block;width:1.05em;height:1.05em;margin-left:.4em;vertical-align:-.16em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1.2'/%3E%3Ccircle cx='20' cy='21' r='1.2'/%3E%3Cpath d='M1 1h4l2.7 13.4a2 2 0 0 0 2 1.6h9.7a2 2 0 0 0 2-1.6L23 6H6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1.2'/%3E%3Ccircle cx='20' cy='21' r='1.2'/%3E%3Cpath d='M1 1h4l2.7 13.4a2 2 0 0 0 2 1.6h9.7a2 2 0 0 0 2-1.6L23 6H6'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.9}