/* ===== Source style block 1: anonymous ===== */

:root {
  --green-950:#08271f;
  --green-900:#0d3b2e;
  --green-800:#14533f;
  --green-700:#1f6b4f;
  --green-600:#2d8b63;
  --green-500:#3eaa78;
  --green-100:#e6f4ed;
  --green-50:#f3faf6;
  --ink:#14201b;
  --muted:#68746e;
  --line:#dfe8e3;
  --white:#fff;
  --shadow:0 20px 60px rgba(8,39,31,.12);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
.container{width:min(1160px,calc(100% - 40px));margin-inline:auto}
.skip-link{position:absolute;left:-999px;top:10px;background:#fff;padding:10px 14px;z-index:1000}.skip-link:focus{left:10px}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(223,232,227,.75)}
.nav-wrap{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{width:150px;height:58px;object-fit:contain;object-position:left center}
.main-nav{display:flex;align-items:center;gap:24px;font-size:14px;font-weight:700}.main-nav>a:not(.btn){padding:8px 0}.main-nav>a:not(.btn):hover{color:var(--green-700)}
.lang-toggle{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:800;cursor:pointer}
.menu-toggle{display:none;border:0;background:none;padding:8px;cursor:pointer}.menu-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:999px;border:1px solid var(--green-700);background:var(--green-700);color:#fff;font-weight:800;transition:.2s ease;cursor:pointer}.btn:hover{transform:translateY(-2px);background:var(--green-800);box-shadow:0 10px 25px rgba(20,83,63,.2)}
.btn-small{min-height:42px;padding:0 16px;font-size:13px}.btn-ghost{background:transparent;color:var(--green-900);border-color:#bfd4c8}.btn-ghost:hover{background:#fff;color:var(--green-900)}
.hero{position:relative;overflow:hidden;padding:92px 0 72px;background:linear-gradient(135deg,#f6fbf8 0%,#eef8f2 52%,#fff 100%)}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(20,83,63,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(20,83,63,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 75%);pointer-events:none}
.hero-glow{position:absolute;border-radius:50%;filter:blur(12px);opacity:.45}.hero-glow-1{width:420px;height:420px;background:#cbead8;right:-120px;top:-150px}.hero-glow-2{width:280px;height:280px;background:#def1e7;left:18%;bottom:-180px}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.eyebrow{margin:0 0 16px;text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:900;color:var(--green-700)}
.hero h1,.section h2{font-size:clamp(42px,5vw,72px);line-height:1.02;letter-spacing:-.045em;margin:0}.hero h1 span{color:var(--green-700)}
.hero-lead{font-size:19px;color:#53615b;max-width:700px;margin:25px 0 30px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-trust{display:flex;gap:30px;margin-top:46px}.hero-trust span{display:flex;flex-direction:column}.hero-trust b{font-size:20px;color:var(--green-900)}.hero-trust small{font-size:12px;color:var(--muted)}
.hero-card{background:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.95);border-radius:30px;box-shadow:var(--shadow);overflow:hidden}.hero-card-top{padding:16px 22px;background:var(--green-900);color:#fff;display:flex;gap:10px;align-items:center;font-size:12px}.status-dot{width:8px;height:8px;border-radius:50%;background:#7dedad;box-shadow:0 0 0 5px rgba(125,237,173,.12)}.hero-card-body{padding:34px}.mini-label{font-size:12px;font-weight:800;color:var(--green-700);text-transform:uppercase;letter-spacing:.08em}.hero-card h2{font-size:34px;line-height:1.08;margin:8px 0 24px;letter-spacing:-.035em}.check-list{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:13px}.check-list li{position:relative;padding-left:28px;color:#52615a}.check-list li:before{content:"✓";position:absolute;left:0;top:0;color:var(--green-700);font-weight:900}.phone-link{position:relative;display:flex;align-items:center;justify-content:center;width:min(100%,340px);height:62px;border:1.5px solid rgba(13,117,82,.28);border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 8px 22px rgba(8,75,54,.08);color:var(--green-900);text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease,background .32s ease;overflow:visible}.phone-link:hover{transform:translateY(-2px);border-color:rgba(13,117,82,.46);box-shadow:0 12px 28px rgba(8,75,54,.12);background:#fff}.phone-link:focus-visible{outline:3px solid rgba(36,185,120,.22);outline-offset:3px}.phone-link:active{transform:scale(.982);box-shadow:0 4px 13px rgba(8,75,54,.10)}.phone-icon{position:absolute;left:-1.5px;top:50%;transform:translateY(-50%);width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#178d63,#0a654a);color:#fff;border:1.5px solid rgba(255,255,255,.72);box-shadow:0 5px 13px rgba(8,75,54,.18);transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease}.phone-link:active .phone-icon{transform:translateY(-50%) scale(.94) rotate(-6deg);box-shadow:0 3px 8px rgba(8,75,54,.16)}.phone-icon svg{width:24px;height:24px;fill:currentColor}.phone-text{display:block;width:100%;padding:0 18px 0 66px;text-align:center}.phone-number{display:block;font-size:28px;line-height:1;font-weight:900;letter-spacing:-.035em;white-space:nowrap}.phone-hint{display:none}@media(max-width:560px){.phone-link{width:100%;height:60px}.phone-icon{width:60px;height:60px}.phone-number{font-size:25px}.phone-text{padding-left:64px;padding-right:12px}}
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-grid div{padding:24px 28px;border-right:1px solid var(--line)}.trust-grid div:first-child{padding-left:0}.trust-grid div:last-child{border-right:0}.trust-grid strong,.trust-grid span{display:block}.trust-grid strong{font-size:14px}.trust-grid span{font-size:12px;color:var(--muted);margin-top:3px}
.section{padding:100px 0}.section-soft{background:var(--green-50)}.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:start}.section-heading h2{font-size:clamp(36px,4vw,58px)}.section-heading.centered{text-align:center;max-width:780px;margin:0 auto 52px}.section-heading.centered p:last-child{color:var(--muted);font-size:17px;margin:20px auto 0;max-width:680px}.copy{font-size:18px;color:#53615b}.copy p:first-child{margin-top:4px}.coverage-card{margin-top:30px;padding:24px 28px;border-left:4px solid var(--green-600);background:var(--green-50);border-radius:0 18px 18px 0}.coverage-card span,.coverage-card strong{display:block}.coverage-card span{font-size:11px;text-transform:uppercase;font-weight:900;letter-spacing:.1em;color:var(--green-700)}.coverage-card strong{font-size:22px;color:var(--green-900);margin:3px 0}.coverage-card p{font-size:14px;margin:0;color:var(--muted)}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;min-height:260px;transition:.2s}.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(8,39,31,.08);border-color:#bfd7ca}.service-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--green-100);color:var(--green-800);font-size:12px;font-weight:900}.service-card h3{font-size:22px;margin:22px 0 10px;letter-spacing:-.025em}.service-card p{font-size:14px;color:var(--muted);margin:0}
.b2b-section{padding-top:0}.b2b-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px;padding:52px 56px;background:linear-gradient(120deg,var(--green-950),var(--green-700));color:#fff;border-radius:30px;box-shadow:var(--shadow)}.b2b-card h2{font-size:44px;max-width:720px}.b2b-card p:not(.eyebrow){max-width:750px;color:#d5e7df}.eyebrow.light{color:#9ee0bc}.btn-light{background:#fff;color:var(--green-900);border-color:#fff}.btn-light:hover{background:#f4faf6;color:var(--green-900)}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:50px}.process-step{padding-top:24px;border-top:2px solid var(--line)}.process-step span{font-size:12px;font-weight:900;color:var(--green-700)}.process-step h3{font-size:20px;margin:10px 0 8px}.process-step p{font-size:14px;color:var(--muted);margin:0}
.form-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:start}.form-copy h2{font-size:48px;letter-spacing:-.04em;line-height:1.08;margin:0 0 20px}.form-copy>p:not(.eyebrow){color:var(--muted)}.contact-mini{display:grid;gap:14px;margin-top:32px}.contact-mini a{display:flex;flex-direction:column;padding:16px 14px;border-bottom:1px solid var(--line);border-radius:16px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;transition:transform .28s cubic-bezier(.2,.8,.2,1),background-color .28s ease,box-shadow .28s ease}.contact-mini a:hover{background:rgba(19,118,82,.04);transform:translateY(-1px)}.contact-mini a:active{transform:scale(.988);background:rgba(19,118,82,.07);box-shadow:inset 0 0 0 1px rgba(19,118,82,.10)}.contact-mini a:focus-visible{outline:3px solid rgba(36,185,120,.22);outline-offset:3px}.contact-mini a strong,.contact-mini a span{-webkit-user-select:none;user-select:none;pointer-events:none}.contact-mini strong{font-size:16px;color:var(--green-900)}.contact-mini span{font-size:12px;color:var(--muted)}.form-section-label{margin:12px 0 14px}
.visit-form{background:#fff;border:1px solid var(--line);padding:34px;border-radius:26px;box-shadow:0 18px 50px rgba(8,39,31,.06)}.visit-form label{display:grid;gap:7px;font-size:12px;font-weight:800;color:#405048;margin-bottom:16px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.visit-form input,.visit-form select,.visit-form textarea{width:100%;border:1px solid #cedbd4;background:#fbfdfc;border-radius:12px;padding:13px 14px;color:var(--ink);outline:none}.visit-form input:focus,.visit-form select:focus,.visit-form textarea:focus{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.13)}.visit-form textarea{resize:vertical}.check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start;gap:10px!important;font-weight:500!important;color:var(--muted)!important}.check input{width:16px;height:16px;margin-top:3px}.hidden{display:none!important}.form-submit{width:100%;border:0}.form-note{font-size:11px;color:var(--muted);text-align:center;margin:12px 0 0}
.phone-field{display:grid;gap:7px;margin-bottom:16px}.phone-field>span{font-size:12px;font-weight:800;color:#405048}.phone-input-group{display:flex;width:100%;border:1px solid #cedbd4;background:#fbfdfc;border-radius:12px;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.phone-input-group:focus-within{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.13);background:#fff}.phone-input-group .dial-code{flex:0 0 116px;width:116px;border:0!important;border-right:1px solid #d8e2dd!important;border-radius:0!important;background:#f2f8f5!important;padding:13px 28px 13px 12px!important;font-weight:800;color:var(--green-900);outline:none;box-shadow:none!important;cursor:pointer}.phone-input-group input[type=tel]{flex:1;min-width:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding:13px 14px!important}.phone-input-group input[type=tel]:focus{box-shadow:none!important}.phone-input-group .dial-code:focus{box-shadow:none!important}.phone-input-group .dial-code option{color:#17211d;background:#fff}.phone-field-hint{font-size:10px;color:#7b8983;font-weight:500;margin-top:-2px}@media(max-width:420px){.phone-input-group .dial-code{flex-basis:108px;width:108px;padding-left:10px!important;padding-right:22px!important}.phone-input-group input[type=tel]{padding-left:12px!important}}
.contact-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center;padding:44px;border:1px solid var(--line);border-radius:26px}.contact-panel h2{font-size:38px}.contact-links{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.contact-links a,.contact-links div{display:flex;flex-direction:column}.contact-links a{position:relative;padding:16px 0 14px;border-radius:16px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;transition:transform .28s cubic-bezier(.2,.8,.2,1),background-color .28s ease,box-shadow .28s ease}.contact-links a:hover{background:rgba(19,118,82,.04);transform:translateY(-1px)}.contact-links a:active{transform:scale(.988);background:rgba(19,118,82,.07);box-shadow:inset 0 0 0 1px rgba(19,118,82,.10)}.contact-links a:focus-visible{outline:3px solid rgba(36,185,120,.22);outline-offset:3px}.contact-links a strong,.contact-links a span{-webkit-user-select:none;user-select:none}.contact-links span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900}.contact-links strong{font-size:15px;margin-top:5px;color:var(--green-900)}
.site-footer{background:#071d17;color:#d8e5df;padding:60px 0 22px}.footer-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr .8fr;gap:45px}.footer-grid>div{display:flex;flex-direction:column;gap:8px}.footer-brand img{width:130px;background:#fff;border-radius:10px;padding:7px}.footer-brand p{margin:0;font-size:13px}.footer-grid strong{color:#fff;margin-bottom:6px}.footer-grid a,.footer-grid span{font-size:13px;color:#aebfb7}.footer-grid a:hover{color:#fff}.muted{opacity:.68}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:11px;color:#93a69d}
.floating-whatsapp{position:fixed;right:22px;bottom:22px;z-index:80;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.18);border:4px solid #fff}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.is-visible{opacity:1;transform:none}
@media (max-width:980px){.nav-wrap{justify-content:flex-start;gap:12px}.menu-toggle{display:block;margin-left:2px;flex:0 0 auto}.mobile-lang-dropdown{display:flex!important;align-items:center;margin-left:auto;margin-right:0;flex:0 0 auto;position:relative;z-index:4}.main-nav{display:none;position:absolute;top:82px;left:20px;right:20px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.main-nav.open{display:flex}.main-nav .btn{text-align:center}.main-nav .lang-switch{display:none}.hero{padding-top:62px}.hero-grid,.split,.form-grid,.contact-panel{grid-template-columns:1fr;gap:34px}.hero-grid{max-width:760px}.hero-card{max-width:620px}.trust-grid{grid-template-columns:1fr 1fr}.trust-grid div:nth-child(2){border-right:0}.trust-grid div:nth-child(-n+2){border-bottom:1px solid var(--line)}.trust-grid div{padding:20px}.service-grid{grid-template-columns:1fr 1fr}.process-grid{grid-template-columns:1fr 1fr}.b2b-card{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}}
@media (max-width:640px){.container{width:min(100% - 28px,1160px)}.site-header .nav-wrap{min-height:72px}.brand img{width:128px;height:50px}.mobile-lang-trigger{height:38px;min-width:82px;padding:0 10px}.mobile-lang-menu{width:198px}.main-nav{top:72px;left:14px;right:14px}.hero{padding:48px 0}.hero h1{font-size:44px}.hero-lead{font-size:16px}.hero-actions .btn{width:100%}.hero-trust{gap:18px;justify-content:space-between}.hero-trust b{font-size:17px}.hero-trust small{font-size:10px}.hero-card-body{padding:25px}.hero-card h2{font-size:28px}.trust-grid{grid-template-columns:1fr}.trust-grid div{border-right:0!important;border-bottom:1px solid var(--line)!important;padding:18px 0}.trust-grid div:last-child{border-bottom:0!important}.section{padding:58px 0}.section-heading.centered{margin:0 auto 34px}.section-heading h2,.form-copy h2{font-size:38px}.service-grid,.process-grid,.field-row,.contact-links,.footer-grid{grid-template-columns:1fr}.service-card{min-height:auto}.b2b-card{padding:30px 26px}.b2b-card h2{font-size:34px}.visit-form{padding:22px}.contact-panel{padding:24px 24px 28px;gap:24px}.contact-mini{margin-top:22px;gap:10px}.contact-mini a{padding:12px 14px}.form-section-label{margin:4px 0 10px}.contact-links{gap:8px}.contact-links a,.contact-links div{padding:10px 0 8px}.site-footer{padding:42px 0 18px}.footer-grid{gap:26px}.footer-bottom{flex-direction:column;margin-top:28px;padding-top:18px}.floating-whatsapp{width:54px;height:54px;right:16px;bottom:16px}}


/* ============================
   Clean4U V2 visual refinements
   ============================ */
body{background:#f3f7f4}
.site-header{background:rgba(247,250,248,.90)}
.hero{background:linear-gradient(135deg,#eef8f2 0%,#e5f3ea 50%,#f9fcfa 100%)}
.hero:after{background-image:linear-gradient(rgba(20,83,63,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(20,83,63,.06) 1px,transparent 1px)}
.section:not(.section-soft){background:rgba(255,255,255,.42)}
.section-soft{background:linear-gradient(180deg,#eaf5ef 0%,#f0f8f3 100%)}

.lang-switch{display:flex;align-items:center;gap:4px;padding:4px;background:#eef5f1;border:1px solid #d9e6df;border-radius:999px}
.lang-choice{display:flex;align-items:center;gap:5px;border:0;background:transparent;color:#52615a;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:900;cursor:pointer;transition:.2s ease}
.lang-choice .flag{font-size:15px;line-height:1}
.lang-choice:hover{color:var(--green-800);background:rgba(255,255,255,.65)}
.lang-choice.is-active{background:#fff;color:var(--green-800);box-shadow:0 2px 8px rgba(8,39,31,.09)}.mobile-lang-dropdown{display:none;position:relative;z-index:150}.mobile-lang-trigger{height:40px;min-width:86px;border:1px solid #d9e6df;background:#fff;border-radius:999px;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:7px;color:var(--green-900);font:inherit;font-size:12px;font-weight:900;cursor:pointer;box-shadow:0 6px 18px rgba(8,39,31,.06);-webkit-tap-highlight-color:transparent;transition:background .2s ease,box-shadow .2s ease,transform .2s ease}.mobile-lang-trigger:hover,.mobile-lang-trigger[aria-expanded='true']{background:#f5faf7;box-shadow:0 8px 22px rgba(8,39,31,.09)}.mobile-lang-trigger:active{transform:scale(.98)}.mobile-lang-trigger .lang-trigger-flag{font-size:17px;line-height:1}.mobile-lang-trigger .lang-trigger-code{letter-spacing:.03em}.mobile-lang-trigger svg{width:14px;height:14px;transition:transform .22s cubic-bezier(.2,.8,.2,1)}.mobile-lang-trigger[aria-expanded='true'] svg{transform:rotate(180deg)}.mobile-lang-menu{position:absolute;right:0;top:calc(100% + 9px);width:210px;background:rgba(255,255,255,.99);border:1px solid rgba(16,106,75,.15);border-radius:16px;padding:7px;box-shadow:0 22px 55px rgba(7,48,35,.16);transform-origin:top right;animation:langMenuIn .2s cubic-bezier(.2,.8,.2,1);overflow:hidden}.mobile-lang-menu[hidden]{display:none}.mobile-lang-option{width:100%;border:0;background:transparent;border-radius:11px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:9px;padding:10px 11px;color:#26332e;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .16s ease,transform .16s ease}.mobile-lang-option:hover,.mobile-lang-option:focus-visible{background:#eff8f3;outline:none}.mobile-lang-option:active{transform:scale(.99)}.mobile-lang-option.is-selected{background:#e6f5ed;color:var(--green-900)}.mobile-lang-option .lang-option-flag{font-size:19px;line-height:1}.mobile-lang-option .lang-option-name{font-size:13px;font-weight:800}.mobile-lang-option .lang-option-code{font-size:11px;font-weight:900;color:#6b7d75}.mobile-lang-option.is-selected .lang-option-code{color:var(--green-700)}@keyframes langMenuIn{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}.contact-mini a[href^='mailto'],.contact-mini a[href^='tel'],.contact-links a[href^='mailto'],.contact-links a[href^='tel']{-webkit-tap-highlight-color:transparent}

.hero h1 .hero-result{color:var(--green-700)}
.hero-pro{display:inline-block;background:linear-gradient(120deg,#0a4f38 0%,#169365 42%,#6ed49b 58%,#0b6244 100%);background-size:180% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 7px 24px rgba(31,107,79,.17);filter:drop-shadow(0 1px 0 rgba(255,255,255,.65));font-weight:950;letter-spacing:-.055em;animation:proShine 5.5s ease-in-out infinite}
@keyframes proShine{0%,72%,100%{background-position:0% 50%}84%{background-position:100% 50%}}
.trust-check{font-size:25px!important;line-height:1;color:var(--green-600)!important}

.trust-strip{background:rgba(255,255,255,.82)}
.trust-grid{align-items:stretch}
.trust-grid div{padding:25px 24px!important;border-right:1px solid var(--line);display:flex;min-height:96px;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.trust-grid div:first-child{padding-left:24px!important}
.trust-grid strong{font-size:14px;min-height:22px;display:flex;align-items:center;justify-content:center}
.trust-grid span{font-size:12px;line-height:1.35;max-width:205px;min-height:34px;display:flex;align-items:flex-start;justify-content:center}

.eyebrow.emphasis{display:inline-flex;align-items:center;justify-content:center;font-size:15px;letter-spacing:.155em;font-weight:950;color:#13704f;padding:8px 14px;border-radius:999px;border:1px solid rgba(45,139,99,.18);background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(220,242,230,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 8px 25px rgba(31,107,79,.07);margin-bottom:20px}
.section-heading.centered .eyebrow.emphasis{margin-inline:auto}

.service-grid{gap:22px}
.service-card{padding:18px 20px 25px;min-height:390px;border-color:#d7e4dc;background:rgba(255,255,255,.94);box-shadow:0 8px 28px rgba(8,39,31,.035)}
.service-card:hover{transform:translateY(-6px);box-shadow:0 20px 48px rgba(8,39,31,.11);border-color:#b8d4c5}
.service-media{position:relative;height:112px;margin-bottom:20px;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#d9eee2,#eef8f2);isolation:isolate}
.service-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,38,29,.02),rgba(7,38,29,.13));z-index:1;pointer-events:none}
.service-media img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.88) contrast(.96);transition:transform .45s ease,filter .45s ease}
.service-card:hover .service-media img{transform:scale(1.035);filter:saturate(.98) contrast(1)}
.service-number{position:absolute;left:12px;bottom:10px;z-index:2;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.91);backdrop-filter:blur(8px);color:var(--green-800);font-size:12px;font-weight:950;box-shadow:0 7px 22px rgba(8,39,31,.14);border:1px solid rgba(255,255,255,.9)}
.service-card h3{font-size:22px;margin:0 0 10px}
.service-card p{font-size:14px;line-height:1.62}

.form-copy .eyebrow.emphasis{font-size:16px}
.visit-form{border-color:#d5e4dc;background:rgba(255,255,255,.96)}
.contact-panel{background:rgba(255,255,255,.66)}

.floating-whatsapp{transition:.2s ease}
.floating-whatsapp:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 16px 34px rgba(0,0,0,.22)}
.floating-whatsapp svg{width:29px;height:29px;fill:currentColor;display:block}

@media (max-width:980px){
  .main-nav .lang-switch{align-self:flex-start}
  .trust-grid div:first-child{padding-left:20px!important}
  .service-card{min-height:380px}
}
@media (max-width:640px){
  .lang-switch{width:max-content}
  .hero h1{font-size:43px}
  .trust-grid div,.trust-grid div:first-child{padding:18px 0!important;min-height:84px}
  .trust-grid span{min-height:auto}
  .service-card{min-height:auto;padding:16px 17px 22px}
  .service-media{height:106px}
  .eyebrow.emphasis,.form-copy .eyebrow.emphasis{font-size:13px;letter-spacing:.12em;padding:7px 11px}
}


/* ===== Clean4U V3 refinements ===== */
body{
  background:#f5f6f4;
}
.hero{
  background:
    radial-gradient(circle at 86% 14%, rgba(45,139,99,.10), transparent 28%),
    linear-gradient(135deg,#fbfcfb 0%,#f5f7f5 55%,#ffffff 100%);
}
.hero:after{
  opacity:.62;
}
.hero-glow-1{background:#cfe7d8;opacity:.32}
.hero-glow-2{background:#e3efe8;opacity:.34}
.section:not(.section-soft){background:#f5f6f4}
.section-soft{
  background:linear-gradient(180deg,#eef1ef 0%,#f4f5f3 100%);
}
.trust-strip{background:#ffffff}
.hero-card,.service-card,.visit-form,.contact-panel{
  box-shadow:0 18px 46px rgba(8,39,31,.075);
}
.service-card{border-color:#d8e1dc}
.contact-panel{background:#fff}

/* Large, clean green section labels: no pills / bubbles */
.eyebrow{
  font-size:17px;
  line-height:1.25;
  letter-spacing:.075em;
  font-weight:950;
  color:#1a7d58;
  text-transform:uppercase;
  margin-bottom:18px;
}
.eyebrow.emphasis,
.form-copy .eyebrow.emphasis{
  display:block;
  width:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  font-size:22px;
  line-height:1.2;
  letter-spacing:.075em;
  font-weight:950;
  color:#1a7d58;
  margin:0 0 20px;
}
.section-heading.centered .eyebrow.emphasis{margin-inline:auto}
.section-heading .eyebrow:not(.emphasis){font-size:18px}
.b2b-card .eyebrow.light{
  color:#a5edc2;
  font-size:19px;
  letter-spacing:.075em;
  margin-bottom:15px;
}
.hero-card .mini-label{
  font-size:14px;
  letter-spacing:.075em;
  color:#1a7d58;
}
.contact-panel .eyebrow{
  font-size:21px;
  margin-bottom:13px;
}

/* Keep the full word PROfesională together on its own line */
.hero h1{
  font-size:clamp(46px,4.65vw,68px);
}
.hero-professional{
  display:inline-block;
  white-space:nowrap;
}
.hero-pro{
  padding-right:.02em;
}

/* More polished / symmetric advantage strip */
.trust-grid{
  align-items:stretch;
}
.trust-grid div{
  min-height:106px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:22px 26px;
}
.trust-grid div:first-child{padding-left:26px}
.trust-grid strong{
  min-height:23px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
}
.trust-grid span{
  max-width:220px;
  min-height:36px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  line-height:1.45;
}

/* Service cards: a little more visual hierarchy */
.service-card{
  min-height:390px;
  padding:17px 18px 27px;
}
.service-media{
  height:124px;
  margin-bottom:23px;
}
.service-card h3,.service-card p{
  padding-inline:10px;
}
.service-card h3{font-size:23px}

/* Temporary before/after visual for textile card: same real upholstery image,
   with a deliberately dirtier left half so the concept is immediately readable. */
.textile-split:before{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  top:0;
  bottom:0;
  width:50%;
  background:
    radial-gradient(circle at 24% 45%, rgba(80,54,31,.30) 0 10%, transparent 24%),
    radial-gradient(circle at 68% 66%, rgba(72,50,31,.24) 0 8%, transparent 23%),
    linear-gradient(rgba(73,57,40,.26),rgba(89,66,42,.22));
  mix-blend-mode:multiply;
  pointer-events:none;
}
.textile-split:after{
  content:"";
  position:absolute;
  z-index:3;
  top:10px;
  bottom:10px;
  left:50%;
  width:1px;
  background:rgba(255,255,255,.85);
  box-shadow:0 0 0 1px rgba(8,39,31,.10);
  pointer-events:none;
}
.textile-split .service-number{z-index:4}

/* Slightly stronger process styling */
.process-step{
  border-top:2px solid #cfdad4;
  background:rgba(255,255,255,.36);
  border-radius:0 0 18px 18px;
  padding:24px 18px 18px;
}
.process-step span{
  font-size:13px;
  color:#1a7d58;
}

@media (max-width:980px){
  .trust-grid div:first-child{padding-left:20px!important}
  .hero h1{font-size:clamp(45px,7vw,62px)}
}
@media (max-width:640px){
  .hero h1{font-size:41px}
  .hero-professional{white-space:nowrap}
  .eyebrow{font-size:15px}
  .section-heading .eyebrow:not(.emphasis){font-size:16px}
  .eyebrow.emphasis,.form-copy .eyebrow.emphasis{font-size:18px;letter-spacing:.065em;padding:0}
  .contact-panel .eyebrow{font-size:18px}
  .service-card{min-height:auto}
  .service-media{height:112px}
}


/* ===== Clean4U V4 refinements ===== */
/* Robust language flags */
.flag-svg{display:inline-flex;width:22px;height:15px;border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(20,32,27,.12);flex:0 0 auto}
.flag-svg svg{display:block;width:100%;height:100%}
.lang-choice{gap:6px}

/* Keep only PRO accented; the rest of the word remains ink-black */
.hero-professional{color:var(--ink)!important}
.hero-professional .hero-pro{color:transparent!important}

/* Hero micro-proof row: equal rhythm, aligned labels */
.hero-trust{display:grid;grid-template-columns:repeat(3,minmax(118px,1fr));gap:22px;max-width:500px;align-items:stretch}
.hero-trust>span{display:grid;grid-template-rows:34px 38px;align-items:start;min-width:0}
.hero-trust b{height:34px;display:flex;align-items:center;font-size:20px;color:var(--green-900);line-height:1}
.hero-trust small{height:38px;display:flex;align-items:flex-start;font-size:12px;line-height:1.35;color:var(--muted)}
.trust-mark{font-size:23px!important;color:var(--green-600)!important;filter:drop-shadow(0 4px 10px rgba(45,139,99,.2))}

/* Emerald advantage band */
.trust-strip{border:0;background:linear-gradient(120deg,#08291f 0%,#0f4937 48%,#126447 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -1px 0 rgba(0,0,0,.12)}
.trust-grid{gap:0}
.trust-grid div{position:relative;border-right:1px solid rgba(255,255,255,.16)!important;border-bottom:0!important;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));min-height:112px;padding:23px 26px!important}
.trust-grid div:before{content:"";position:absolute;top:0;left:24%;right:24%;height:2px;background:linear-gradient(90deg,transparent,rgba(126,239,176,.68),transparent)}
.trust-grid div:last-child{border-right:0!important}
.trust-grid strong{color:#fff;font-size:15px}
.trust-grid span{color:#d2e7dd;font-size:12px}

/* Tiny brand mark beside the about label */
.about-eyebrow{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.about-mini-logo{display:inline-block;width:auto;height:22px;max-width:76px;object-fit:contain;object-position:left center;opacity:.9;transform:translateY(1px)}

/* Process: four distinct, polished cards */
.process-grid{gap:18px;margin-top:52px}
.process-step{position:relative;overflow:hidden;border:1px solid #d7e2dc;background:rgba(255,255,255,.92);border-radius:20px;padding:28px 24px 24px;box-shadow:0 10px 30px rgba(8,39,31,.055);transition:.22s ease}
.process-step:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#0d3b2e,#2d8b63,#6fcea0)}
.process-step:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(8,39,31,.09);border-color:#bfd5c8}
.process-step span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#0d3b2e,#24805c);color:#fff;font-size:12px;font-weight:950;box-shadow:0 8px 20px rgba(13,59,46,.18)}
.process-step h3{font-size:20px;margin:18px 0 8px}
.process-step p{font-size:14px;line-height:1.55;color:var(--muted);margin:0}

/* Image framing: slightly cleaner crop for first and before/after third card */
.service-card:nth-child(1) .service-media img{object-position:center 48%}
.service-card:nth-child(3) .service-media img{object-position:center center;filter:saturate(.92) contrast(.98)}

@media (max-width:980px){
  .trust-grid div:nth-child(2){border-right:0!important}
  .trust-grid div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14)!important}
  .hero-trust{max-width:520px}
}
@media (max-width:640px){
  .hero-trust{grid-template-columns:repeat(3,1fr);gap:10px;max-width:100%}
  .hero-trust>span{grid-template-rows:31px auto}
  .hero-trust b{font-size:18px;height:31px}
  .hero-trust small{height:auto;font-size:10px;line-height:1.3}
  .trust-mark{font-size:20px!important}
  .trust-grid div{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important;padding:20px 0!important;min-height:88px}
  .trust-grid div:last-child{border-bottom:0!important}
  .about-mini-logo{height:19px;max-width:66px}
  .process-step{padding:24px 21px 22px}
}


/* ===== Clean4U V4.1 micro-refinements ===== */
/* Text marker instead of decorative icon */
.trust-mark-text{
  font-size:18px!important;
  font-weight:950!important;
  letter-spacing:.055em;
  color:var(--green-700)!important;
  filter:none!important;
}

/* Finish the emerald band as four clearly separated, identical panels */
.trust-strip{
  padding:10px 0;
  background:linear-gradient(180deg,
    #f3f7f4 0%,
    #dfe9e3 6px,
    #0a3227 14px,
    #0d4635 50%,
    #0a3227 calc(100% - 14px),
    #dfe9e3 calc(100% - 6px),
    #f3f7f4 100%
  );
}
.trust-grid{
  gap:12px;
}
.trust-grid div,
.trust-grid div:first-child{
  padding:22px 24px!important;
  min-height:106px;
  border:1px solid rgba(180,238,205,.20)!important;
  border-radius:15px;
  background:linear-gradient(145deg,#124f3c 0%,#0b3d2f 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    0 8px 22px rgba(3,27,20,.16);
}
.trust-grid div:before{
  left:24%;
  right:24%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(126,239,176,.62),transparent);
}
.trust-grid div:last-child{
  border-right:1px solid rgba(180,238,205,.20)!important;
}

@media (max-width:980px){
  .trust-grid{gap:10px}
  .trust-grid div,
  .trust-grid div:first-child,
  .trust-grid div:nth-child(2),
  .trust-grid div:nth-child(-n+2){
    border:1px solid rgba(180,238,205,.20)!important;
    padding:20px!important;
  }
}
@media (max-width:640px){
  .trust-strip{padding:12px 0}
  .trust-grid{gap:9px}
  .trust-grid div,
  .trust-grid div:first-child,
  .trust-grid div:last-child{
    min-height:84px;
    border:1px solid rgba(180,238,205,.20)!important;
    padding:18px 14px!important;
  }
}


/* ===== Clean4U V4.2 mobile polish ===== */
/* Main CTA: the same emerald moving-light language used on “PRO”,
   translated to a button surface rather than text. */
.btn-hero-shine{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:#0b6648;
  background:linear-gradient(112deg,#0b513b 0%,#16845e 34%,#43b67d 50%,#117351 64%,#0a4b37 100%);
  background-size:220% 100%;
  box-shadow:0 12px 30px rgba(11,82,59,.20), inset 0 1px 0 rgba(255,255,255,.18);
  animation:ctaEmeraldShine 5.5s ease-in-out infinite;
}
.btn-hero-shine::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:-45%;
  bottom:-45%;
  width:24%;
  left:-38%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  filter:blur(.2px);
  animation:ctaGlassSweep 5.5s ease-in-out infinite;
  pointer-events:none;
}
.btn-hero-shine:hover{
  background:linear-gradient(112deg,#0a4a36 0%,#147a57 35%,#3daa74 51%,#0f684a 66%,#083f30 100%);
  background-size:220% 100%;
  box-shadow:0 15px 34px rgba(11,82,59,.28), inset 0 1px 0 rgba(255,255,255,.2);
}
@keyframes ctaEmeraldShine{
  0%,72%,100%{background-position:0% 50%}
  84%{background-position:100% 50%}
}
@keyframes ctaGlassSweep{
  0%,73%{left:-38%;opacity:0}
  76%{opacity:.15}
  84%{left:118%;opacity:.55}
  88%,100%{left:118%;opacity:0}
}

/* Advantage band: make every panel feel like a finished card, especially on phones. */
.trust-grid strong,
.trust-grid span{
  width:100%;
  text-align:center;
}
.trust-grid strong{
  line-height:1.22;
  letter-spacing:-.01em;
}
.trust-grid span{
  align-items:center;
  line-height:1.38;
}

@media (max-width:980px){
  .trust-strip{padding:18px 0}
  .trust-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .trust-grid div,
  .trust-grid div:first-child,
  .trust-grid div:nth-child(2),
  .trust-grid div:nth-child(-n+2),
  .trust-grid div:last-child{
    box-sizing:border-box;
    width:100%;
    min-height:112px;
    padding:22px 18px!important;
    display:grid;
    grid-template-rows:auto auto;
    align-content:center;
    justify-items:center;
    row-gap:8px;
    border:1px solid rgba(181,239,206,.24)!important;
    border-radius:18px;
    background:linear-gradient(145deg,rgba(20,84,64,.96) 0%,rgba(10,57,44,.98) 100%)!important;
  }
  .trust-grid strong{
    min-height:0;
    font-size:15px;
  }
  .trust-grid span{
    min-height:0;
    max-width:245px;
    font-size:12px;
  }
}

@media (max-width:640px){
  .trust-strip{
    padding:8px 0;
    background:linear-gradient(180deg,
      #f5f8f6 0%,
      #e7efea 4px,
      #0a3528 10px,
      #0d4836 50%,
      #0a3528 calc(100% - 10px),
      #e7efea calc(100% - 4px),
      #f5f8f6 100%
    );
  }
  .trust-strip>.container{
    width:min(100% - 24px,520px);
  }
  .trust-grid{
    grid-template-columns:1fr;
    gap:12px;
    justify-items:center;
  }
  .trust-grid div,
  .trust-grid div:first-child,
  .trust-grid div:nth-child(2),
  .trust-grid div:nth-child(-n+2),
  .trust-grid div:last-child{
    width:100%;
    min-height:106px;
    padding:20px 22px!important;
    border-radius:18px;
    border:1px solid rgba(185,241,210,.26)!important;
    background:linear-gradient(145deg,#13533f 0%,#0a3b2d 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 9px 22px rgba(3,27,20,.15);
  }
  .trust-grid div:before{
    left:31%;
    right:31%;
  }
  .trust-grid strong{
    font-size:15.5px;
    line-height:1.2;
  }
  .trust-grid span{
    max-width:285px;
    font-size:12.5px;
    line-height:1.35;
  }
}

@media (prefers-reduced-motion:reduce){
  .btn-hero-shine,.btn-hero-shine::after{animation:none!important}
}


/* ===== Clean4U V4.3 WhatsApp CTA polish ===== */
.btn-whatsapp-main{
  position:relative;
  overflow:hidden;
  gap:10px;
  color:#fff;
  background:linear-gradient(135deg,#20bd5a 0%,#25D366 48%,#18ad4f 100%);
  border-color:#20bd5a;
  box-shadow:0 10px 26px rgba(37,211,102,.22),inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-whatsapp-main:hover{
  color:#fff;
  background:linear-gradient(135deg,#18ad4f 0%,#25D366 50%,#159746 100%);
  border-color:#18ad4f;
  box-shadow:0 14px 30px rgba(37,211,102,.30),inset 0 1px 0 rgba(255,255,255,.24);
}
.btn-whatsapp-main svg{
  width:21px;
  height:21px;
  flex:0 0 21px;
  fill:currentColor;
}

/* Floating WhatsApp: first prompt shortly after entry, then at a calmer interval. */
.floating-whatsapp{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:80;
  width:58px;
  height:58px;
  padding:0;
  overflow:hidden;
  white-space:nowrap;
  border-radius:999px;
  background:#25D366;
  color:#fff;
  border:4px solid #fff;
  box-sizing:border-box;
  box-shadow:0 12px 30px rgba(0,0,0,.18);
  transform-origin:right center;
  transition:width .88s cubic-bezier(.4,0,.2,1),transform .28s ease,box-shadow .28s ease;
}
.floating-whatsapp svg{
  position:absolute;
  left:50%;
  top:50%;
  width:29px;
  height:29px;
  min-width:29px;
  transform:translate(-50%,-50%);
  fill:currentColor;
  display:block;
  transition:left .88s cubic-bezier(.4,0,.2,1),transform .88s cubic-bezier(.4,0,.2,1);
}
.floating-whatsapp .wa-float-label{
  position:absolute;
  left:56px;
  top:50%;
  transform:translate(10px,-50%);
  opacity:0;
  pointer-events:none;
  font-size:14px;
  line-height:1;
  font-weight:850;
  letter-spacing:-.01em;
  transition:opacity .42s ease .24s,transform .62s cubic-bezier(.4,0,.2,1) .16s;
}
.floating-whatsapp.is-expanded{width:246px}
.floating-whatsapp.is-expanded svg{
  left:16px;
  transform:translate(0,-50%);
}
.floating-whatsapp.is-expanded .wa-float-label{
  opacity:1;
  transform:translate(0,-50%);
}
.floating-whatsapp.is-suppressed{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px) scale(.94)!important;transition:opacity .28s ease,transform .28s ease,visibility 0s linear .28s!important}
.floating-whatsapp:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 34px rgba(0,0,0,.22);
}
@media (max-width:640px){
  .floating-whatsapp{
    right:16px;
    bottom:16px;
    width:54px;
    height:54px;
  }
  .floating-whatsapp svg{width:29px;height:29px;min-width:29px}
  .floating-whatsapp .wa-float-label{font-size:14px;left:55px}
  .floating-whatsapp.is-expanded{width:calc(100vw - 32px)}
  .floating-whatsapp.is-expanded svg{left:13px}
}
@media (prefers-reduced-motion:reduce){
  .floating-whatsapp,.floating-whatsapp svg,.floating-whatsapp .wa-float-label{transition:none!important}
}


.form-card-wrap{display:grid;gap:10px;align-self:start}
.form-card-wrap .form-section-label{margin:8px 0;padding-left:8px}
.contact-links{align-items:start}
.contact-link-block{display:flex;flex-direction:column;gap:10px;padding:8px 0 10px}.contact-email-block{display:flex;flex-direction:column;gap:10px}
.contact-link-block>span{font-size:11px;line-height:1.1;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:900;margin:0}
.contact-link-block>strong{font-size:16px;line-height:1.22;color:var(--green-900);margin:0}
.contact-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.contact-action-btn{display:inline-flex;align-items:center;justify-content:center;min-width:112px;height:40px;padding:0 18px;border-radius:999px;border:1px solid #cfe0d8;background:#fff;color:var(--green-900);text-decoration:none;font-size:14px;font-weight:900;letter-spacing:.01em;-webkit-tap-highlight-color:transparent;box-shadow:0 8px 18px rgba(8,39,31,.05);transition:transform .22s cubic-bezier(.2,.8,.2,1),background-color .22s ease,box-shadow .22s ease,border-color .22s ease}
.contact-action-btn:hover{background:#f6fbf8;border-color:#b8d5c7;box-shadow:0 8px 18px rgba(8,39,31,.06);transform:translateY(-1px)}
.contact-action-btn:active{transform:scale(.985)}
.contact-action-btn.whatsapp{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(112deg,#16bf57 0%,#25d366 38%,#58e78f 50%,#21cb61 63%,#14ac4f 100%);background-size:220% 100%;border-color:#a8dbbd;color:#083b2d;box-shadow:0 10px 24px rgba(18,168,79,.16), inset 0 1px 0 rgba(255,255,255,.26);animation:ctaEmeraldShine 5.5s ease-in-out infinite}
.contact-action-btn.whatsapp::after{content:'';position:absolute;z-index:0;top:-45%;bottom:-45%;width:24%;left:-38%;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);filter:blur(.2px);animation:ctaGlassSweep 5.5s ease-in-out infinite;pointer-events:none}
.contact-action-btn.whatsapp span,.contact-action-btn.whatsapp{position:relative;z-index:1}
.contact-action-btn.whatsapp:hover{background:linear-gradient(112deg,#14b14f 0%,#21c95f 39%,#4dde84 51%,#1bb95a 64%,#129247 100%);background-size:220% 100%;box-shadow:0 12px 28px rgba(18,168,79,.22), inset 0 1px 0 rgba(255,255,255,.28)}
.contact-phone-block>strong,.contact-link-block:not(.contact-email-block)>strong{padding-top:2px}
.contact-phone-block .contact-actions{padding-top:2px}
.contact-email-block .contact-inline-link{padding:16px 20px 16px 28px}
.contact-inline-link{display:flex;flex-direction:column;gap:4px;padding:14px 18px;border-radius:14px;background:rgba(19,118,82,.04);text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent;box-sizing:border-box;overflow-wrap:anywhere;word-break:break-word;transition:background-color .22s ease,transform .22s cubic-bezier(.2,.8,.2,1)}
.contact-inline-link:hover{background:rgba(19,118,82,.07);transform:translateY(-1px)}
.contact-inline-link strong{font-size:15px;line-height:1.22;margin:0;color:var(--green-900);display:block}
.contact-inline-link small{font-size:12px;line-height:1.22;color:var(--muted);display:block}
@media (max-width:980px){.b2b-section{padding-bottom:36px}#proces.section{padding-top:44px;padding-bottom:42px}#vizionare.section{padding-top:42px;padding-bottom:14px}#despre.section{padding-bottom:42px}#servicii.section{padding-top:42px}.form-grid{gap:22px}#contact.section{padding-top:14px;padding-bottom:18px}.site-footer{margin-top:14px;padding-top:14px}.form-card-wrap{gap:22px}.form-card-wrap .form-section-label{margin:0;padding-left:10px}}
@media (max-width:640px){.b2b-section{padding-bottom:28px}#proces.section{padding-top:34px;padding-bottom:30px}#vizionare.section{padding-top:30px;padding-bottom:12px}#despre.section{padding-bottom:30px}#servicii.section{padding-top:30px}.form-grid{gap:18px}#contact.section{padding-top:12px;padding-bottom:24px}.site-footer{margin-top:0;padding-top:12px}.form-card-wrap{gap:18px}.form-card-wrap .form-section-label{margin:0;padding-left:10px}.contact-panel{gap:20px}.contact-links{gap:6px}.contact-link-block{padding:4px 0 8px}.contact-actions{gap:8px}.contact-action-btn{min-width:104px;height:40px;padding:0 16px}.contact-inline-link{padding:14px 16px}.contact-email-block .contact-inline-link{padding:16px 18px 16px 24px}.b2b-section + #proces,.section#despre + #servicii{margin-top:-8px}}



/* v4.30 - refine emerald band spacing and seamless transitions */
.trust-strip{
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  padding:18px 0;
  background:linear-gradient(180deg,
    #f4f7f5 0,
    #eef3f0 4px,
    #0c3b2d 10px,
    #0d4635 18px,
    #0d4635 calc(100% - 18px),
    #0c3b2d calc(100% - 10px),
    #eef3f0 calc(100% - 4px),
    #f4f7f5 100%
  );
}

@media (max-width:640px){
  .hero{
    padding-top:48px;
    padding-bottom:36px;
  }
  .trust-strip{
    padding:18px 0;
    margin-top:0;
    margin-bottom:0;
    background:linear-gradient(180deg,
      #f5f8f6 0,
      #edf3ef 3px,
      #0b3a2c 8px,
      #0d4635 14px,
      #0d4635 calc(100% - 14px),
      #0b3a2c calc(100% - 8px),
      #edf3ef calc(100% - 3px),
      #f5f8f6 100%
    );
  }
  .trust-strip>.container{
    width:min(100% - 28px,520px);
  }
  #despre.section{
    padding-top:34px;
    padding-bottom:30px;
  }
}



/* v4.31 - services section deep emerald backdrop with seamless transitions */
#servicii.section{
  padding-bottom:20px;
}
.services-stage{
  position:relative;
  width:100vw;
  left:50%;
  transform:translateX(-50%);
  margin-top:24px;
  padding:18px max(20px, calc((100vw - 1160px) / 2)) 22px;
  overflow:hidden;
  background:linear-gradient(180deg,
    #f5f7f5 0%,
    #eef3f0 4px,
    #dfe7e2 8px,
    #0c3b2d 16px,
    #0d4635 22px,
    #0d4635 calc(100% - 30px),
    #124f3c calc(100% - 18px),
    #dfe7e2 calc(100% - 8px),
    #f5f7f5 100%
  );
  box-shadow:
    inset 0 20px 34px rgba(255,255,255,.10),
    inset 0 -16px 28px rgba(255,255,255,.06);
}
.services-stage:before,
.services-stage:after{
  content:"";
  position:absolute;
  left:0;
  width:100%;
  pointer-events:none;
}
.services-stage:before{
  top:0;
  height:22px;
  background:linear-gradient(180deg,
    rgba(245,247,245,1) 0%,
    rgba(241,244,241,.92) 18%,
    rgba(227,235,230,.66) 42%,
    rgba(12,59,45,.92) 82%,
    rgba(13,70,53,1) 100%
  );
}
.services-stage:after{
  bottom:0;
  height:30px;
  background:linear-gradient(180deg,
    rgba(13,70,53,1) 0%,
    rgba(14,74,56,.92) 28%,
    rgba(205,216,210,.62) 78%,
    rgba(245,247,245,1) 100%
  );
}
.services-stage .service-grid{
  position:relative;
  z-index:1;
  max-width:1160px;
  margin:0 auto;
}
.b2b-section{
  padding-top:6px;
}
@media (max-width:980px){
  #servicii.section{padding-bottom:16px}
  .services-stage{margin-top:20px;padding-top:16px;padding-bottom:18px}
  .b2b-section{padding-top:4px}
}
@media (max-width:640px){
  #servicii.section{padding-top:24px;padding-bottom:12px}
  .services-stage{
    margin-top:18px;
    padding:14px 18px 16px;
    background:linear-gradient(180deg,
      #f5f7f5 0%,
      #edf2ef 3px,
      #dfe7e2 6px,
      #0b3a2c 12px,
      #0d4635 16px,
      #0d4635 calc(100% - 22px),
      #114d3a calc(100% - 14px),
      #dfe7e2 calc(100% - 6px),
      #f5f7f5 100%
    );
  }
  .services-stage:before{height:16px}
  .services-stage:after{height:22px}
  .b2b-section{padding-top:2px;padding-bottom:24px}
}



/* v4.32 - smoother services transitions and balanced spacing */
.services-stage{background:#0d4635!important;box-shadow:none!important}
.services-stage:before{
  height:42px!important;
  background:linear-gradient(180deg,
    rgba(245,247,245,1) 0%,
    rgba(245,247,245,.96) 12%,
    rgba(238,243,240,.84) 28%,
    rgba(210,222,216,.54) 48%,
    rgba(88,141,118,.34) 68%,
    rgba(13,70,53,.78) 86%,
    rgba(13,70,53,1) 100%
  )!important;
}
.services-stage:after{
  height:54px!important;
  background:linear-gradient(180deg,
    rgba(13,70,53,1) 0%,
    rgba(16,82,61,.96) 26%,
    rgba(29,102,76,.82) 46%,
    rgba(84,146,120,.44) 68%,
    rgba(216,226,220,.72) 88%,
    rgba(245,247,245,1) 100%
  )!important;
}
.services-stage .service-grid{gap:24px!important}
.b2b-section{
  padding-top:18px!important;
  background:linear-gradient(180deg,
    rgba(16,82,61,.18) 0%,
    rgba(45,116,88,.10) 22%,
    rgba(245,247,245,0) 58px
  )!important;
}
@media (max-width:980px){
  .services-stage{margin-top:24px!important;padding-top:22px!important;padding-bottom:24px!important}
  .services-stage:before{height:34px!important}
  .services-stage:after{height:44px!important}
  .b2b-section{padding-top:20px!important}
}
@media (max-width:640px){
  .services-stage{
    margin-top:26px!important;
    padding:26px 18px 28px!important;
  }
  .services-stage .service-grid{gap:26px!important}
  .services-stage:before{
    height:38px!important;
    background:linear-gradient(180deg,
      rgba(245,247,245,1) 0%,
      rgba(244,246,244,.96) 10%,
      rgba(236,241,238,.86) 24%,
      rgba(214,225,219,.60) 44%,
      rgba(112,159,138,.32) 68%,
      rgba(13,70,53,.76) 88%,
      rgba(13,70,53,1) 100%
    )!important;
  }
  .services-stage:after{
    height:48px!important;
    background:linear-gradient(180deg,
      rgba(13,70,53,1) 0%,
      rgba(18,88,66,.96) 22%,
      rgba(38,111,84,.86) 44%,
      rgba(92,149,125,.52) 68%,
      rgba(220,228,223,.74) 90%,
      rgba(245,247,245,1) 100%
    )!important;
  }
  .b2b-section{
    padding-top:24px!important;
    padding-bottom:24px!important;
    background:linear-gradient(180deg,
      rgba(17,83,61,.20) 0%,
      rgba(57,124,96,.10) 26%,
      rgba(245,247,245,0) 72px
    )!important;
  }
}



/* v4.33 - top short recessed, bottom long smooth white transition */
.services-stage{
  background:#0d4635!important;
  box-shadow:inset 0 16px 24px rgba(255,255,255,.08)!important;
}
.services-stage .service-grid{gap:26px!important}
.services-stage:before{
  height:20px!important;
  background:linear-gradient(180deg,
    rgba(245,247,245,1) 0%,
    rgba(242,245,243,.95) 24%,
    rgba(229,236,232,.72) 52%,
    rgba(94,143,122,.34) 82%,
    rgba(13,70,53,1) 100%
  )!important;
}
.services-stage:after{
  height:64px!important;
  background:linear-gradient(180deg,
    rgba(13,70,53,1) 0%,
    rgba(16,81,60,.95) 16%,
    rgba(32,100,77,.80) 34%,
    rgba(82,143,119,.46) 56%,
    rgba(188,204,196,.22) 78%,
    rgba(255,255,255,.86) 92%,
    rgba(255,255,255,1) 100%
  )!important;
}
.b2b-section{
  padding-top:24px!important;
  background:#fff!important;
}
@media (max-width:980px){
  .services-stage{margin-top:24px!important;padding-top:24px!important;padding-bottom:26px!important}
  .services-stage .service-grid{gap:24px!important}
  .services-stage:before{height:18px!important}
  .services-stage:after{height:56px!important}
  .b2b-section{padding-top:22px!important}
}
@media (max-width:640px){
  .services-stage{
    margin-top:26px!important;
    padding:26px 18px 28px!important;
    box-shadow:inset 0 14px 22px rgba(255,255,255,.08)!important;
  }
  .services-stage .service-grid{gap:26px!important}
  .services-stage:before{
    height:18px!important;
    background:linear-gradient(180deg,
      rgba(245,247,245,1) 0%,
      rgba(242,245,243,.96) 24%,
      rgba(230,237,233,.74) 54%,
      rgba(101,147,127,.34) 82%,
      rgba(13,70,53,1) 100%
    )!important;
  }
  .services-stage:after{
    height:62px!important;
    background:linear-gradient(180deg,
      rgba(13,70,53,1) 0%,
      rgba(16,82,61,.95) 14%,
      rgba(34,103,79,.82) 32%,
      rgba(84,144,120,.50) 56%,
      rgba(197,210,204,.24) 78%,
      rgba(255,255,255,.88) 92%,
      rgba(255,255,255,1) 100%
    )!important;
  }
  .b2b-section{
    padding-top:24px!important;
    padding-bottom:24px!important;
    background:#fff!important;
  }
}



/* ===== Clean4U V4.34 final fixes ===== */
/* Services backdrop: TOP = short/deep/recessed exactly like the first emerald band;
   BOTTOM = long, smooth, unrecessed fade into pure white. */
#servicii.section{padding-bottom:0!important;}
.services-stage{
  background:#0d4635!important;
  box-shadow:inset 0 13px 22px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.08)!important;
  margin-bottom:0!important;
  padding-top:46px!important;
  padding-bottom:154px!important;
}
.services-stage .service-grid{gap:26px!important;}
.services-stage:before{
  top:0!important;
  height:16px!important;
  background:linear-gradient(180deg,
    #f5f8f6 0%,
    #edf3ef 3px,
    #0a3528 10px,
    #0d4836 16px
  )!important;
  box-shadow:0 7px 14px rgba(4,34,25,.16)!important;
}
.services-stage:after{
  bottom:0!important;
  height:122px!important;
  background:linear-gradient(180deg,
    rgba(13,70,53,1) 0%,
    rgba(15,79,59,.98) 12%,
    rgba(25,94,70,.90) 27%,
    rgba(56,119,92,.70) 45%,
    rgba(102,153,131,.48) 60%,
    rgba(162,190,177,.28) 74%,
    rgba(221,231,226,.14) 87%,
    #ffffff 100%
  )!important;
  box-shadow:none!important;
}
.b2b-section{
  padding-top:28px!important;
  background:#fff!important;
}

/* One custom language dropdown on both desktop and mobile. */
.lang-switch{display:none!important;}
.mobile-lang-dropdown{
  display:flex!important;
  align-items:center;
  position:relative;
  z-index:260;
  flex:0 0 auto;
}
.lang-flag-img,.dial-flag-img{
  display:block;
  width:24px;
  height:18px;
  object-fit:cover;
  border-radius:2px;
  box-shadow:0 0 0 1px rgba(8,39,31,.10);
}
.lang-trigger-flag,.lang-option-flag,.dial-selected-flag,.dial-option-flag{
  display:flex!important;
  align-items:center;
  justify-content:center;
}
@media (min-width:981px){
  .brand{order:1;}
  .main-nav{order:2;margin-left:auto;}
  .mobile-lang-dropdown{order:3;margin-left:0;}
  .menu-toggle{order:4;}
  .mobile-lang-trigger{height:42px;min-width:88px;}
  .main-nav .btn-small.btn-hero-shine{overflow:hidden;}
}

/* Custom form dropdowns must overlay all following form controls. */
.visit-form{overflow:visible!important;}
.field-row{position:relative;overflow:visible!important;}
.form-custom-select{position:relative;z-index:30;}
.form-custom-select.is-open{z-index:700!important;}
.form-custom-select.is-open .form-select-menu{z-index:710!important;}

/* Contact desktop: give the long direct email enough room and keep it on one line. */
@media (min-width:981px){
  .contact-panel{grid-template-columns:.68fr 1.32fr!important;gap:42px!important;}
  .contact-links{grid-template-columns:minmax(135px,.85fr) minmax(270px,1.6fr) minmax(135px,.85fr)!important;gap:14px!important;}
  .contact-email-block .contact-inline-link strong{
    white-space:nowrap;
    overflow:visible;
    text-overflow:clip;
    font-size:13.5px!important;
  }
}

@media (max-width:980px){
  .mobile-lang-dropdown{margin-left:auto;margin-right:0;}
  .services-stage{padding-top:44px!important;padding-bottom:142px!important;}
  .services-stage:after{height:114px!important;}
  .b2b-section{padding-top:26px!important;}
}
@media (max-width:640px){
  .services-stage{
    margin-top:26px!important;
    padding:44px 18px 146px!important;
    box-shadow:inset 0 13px 22px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.08)!important;
  }
  .services-stage .service-grid{gap:26px!important;}
  .services-stage:before{
    height:16px!important;
    background:linear-gradient(180deg,#f5f8f6 0%,#edf3ef 3px,#0a3528 10px,#0d4836 16px)!important;
    box-shadow:0 7px 14px rgba(4,34,25,.16)!important;
  }
  .services-stage:after{
    height:118px!important;
    background:linear-gradient(180deg,
      rgba(13,70,53,1) 0%,
      rgba(15,79,59,.98) 12%,
      rgba(25,94,70,.90) 27%,
      rgba(56,119,92,.70) 45%,
      rgba(102,153,131,.48) 60%,
      rgba(162,190,177,.28) 74%,
      rgba(221,231,226,.14) 87%,
      #ffffff 100%
    )!important;
    box-shadow:none!important;
  }
  .b2b-section{padding-top:28px!important;padding-bottom:24px!important;background:#fff!important;}
  .contact-email-block .contact-inline-link strong{white-space:normal;overflow:visible;text-overflow:clip;font-size:15px!important;}
}



/* ===== Clean4U V4.35 — bottom services fade only =====
   Keep V4.34 TOP exactly as-is. Bottom becomes a long, flat, seamless fade to pure white. */
.services-stage{
  padding-bottom:300px!important;
}
.services-stage:after{
  bottom:0!important;
  height:270px!important;
  box-shadow:none!important;
  filter:none!important;
  background:linear-gradient(180deg,
    #0d4635 0%,
    #124d3b 10%,
    #1a5945 21%,
    #2b6854 33%,
    #477d69 45%,
    #679485 57%,
    #8eaca0 68%,
    #b4c6bf 78%,
    #d3ddda 86%,
    #e9eeec 93%,
    #f7f9f8 97%,
    #ffffff 100%
  )!important;
}
.b2b-section{
  padding-top:30px!important;
  background:#fff!important;
  box-shadow:none!important;
}
@media (max-width:980px){
  .services-stage{padding-bottom:270px!important;}
  .services-stage:after{height:242px!important;}
  .b2b-section{padding-top:28px!important;}
}
@media (max-width:640px){
  .services-stage{
    padding:44px 18px 252px!important;
  }
  .services-stage:after{
    height:226px!important;
    box-shadow:none!important;
    filter:none!important;
    background:linear-gradient(180deg,
      #0d4635 0%,
      #124d3b 10%,
      #1a5945 21%,
      #2b6854 33%,
      #477d69 45%,
      #679485 57%,
      #8eaca0 68%,
      #b4c6bf 78%,
      #d3ddda 86%,
      #e9eeec 93%,
      #f7f9f8 97%,
      #ffffff 100%
    )!important;
  }
  .b2b-section{
    padding-top:28px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
}



/* ===== Clean4U V4.36 — balance B2B card vertically in the pure-white zone ===== */
@media (min-width:981px){
  .b2b-section{
    padding-top:58px!important;
    padding-bottom:0!important;
    background:#fff!important;
  }
  #proces.section{
    padding-top:58px!important;
  }
}
@media (min-width:641px) and (max-width:980px){
  .b2b-section{
    padding-top:46px!important;
    padding-bottom:0!important;
    background:#fff!important;
  }
  #proces.section{
    padding-top:46px!important;
  }
}
@media (max-width:640px){
  .b2b-section{
    padding-top:34px!important;
    padding-bottom:0!important;
    background:#fff!important;
  }
  #proces.section{
    padding-top:34px!important;
  }
}



/* v4.37 - shiny process markers + aligned form section labels */
.process-step:before{
  background:linear-gradient(90deg,#0b513b 0%,#16845e 30%,#59d99b 48%,#a5f3c7 54%,#2ea572 64%,#0d5a41 100%)!important;
  background-size:240% 100%!important;
  animation:processLineShine 5.5s ease-in-out infinite;
}
.process-step span{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:linear-gradient(112deg,#0b513b 0%,#16845e 34%,#43b67d 50%,#117351 64%,#0a4b37 100%)!important;
  background-size:220% 100%!important;
  box-shadow:0 8px 20px rgba(13,59,46,.20),inset 0 1px 0 rgba(255,255,255,.16)!important;
  animation:ctaEmeraldShine 5.5s ease-in-out infinite;
}
.process-step span:after{
  content:"";
  position:absolute;
  z-index:-1;
  top:-45%;
  bottom:-45%;
  width:28%;
  left:-42%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  animation:processBadgeSweep 5.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes processLineShine{
  0%,72%,100%{background-position:0% 50%}
  84%{background-position:100% 50%}
}
@keyframes processBadgeSweep{
  0%,73%{left:-42%;opacity:0}
  76%{opacity:.15}
  84%{left:118%;opacity:.58}
  88%,100%{left:118%;opacity:0}
}
.form-grid>.form-copy>.eyebrow.emphasis,
.form-grid>.form-card-wrap>.form-section-label{
  margin-top:0!important;
}
.form-grid>.form-card-wrap>.form-section-label{
  margin-bottom:18px!important;
  padding-top:0!important;
  transform:translateY(-1px);
}
@media (max-width:980px){
  .form-grid>.form-card-wrap>.form-section-label{transform:none;margin-bottom:10px!important}
}
@media (prefers-reduced-motion:reduce){
  .process-step:before,.process-step span,.process-step span:after{animation:none!important}
}



/* v4.38 WhatsApp styling superseded by v4.43 clean block */
#vizionare.section{padding-bottom:6px!important}
#contact.section{padding-top:6px!important}
@media (max-width:980px){
  #vizionare.section{padding-bottom:5px!important}
  #contact.section{padding-top:5px!important}
}
@media (max-width:640px){
  #vizionare.section{padding-bottom:4px!important}
  #contact.section{padding-top:4px!important}
}
@media (prefers-reduced-motion:reduce){
  .btn-whatsapp-main,.btn-whatsapp-main::after{animation:none!important}
}





/* ===== V4.69 — mobile contact / careers polish ===== */

@media (max-width:640px){
  /* Give the fixed WhatsApp pill a cleaner breathing gap around process cards. */
  #proces .process-grid{
    gap:28px!important;
  }

  /* Align EMAIL with the rest of the contact column on mobile. */
  .contact-email-block > span,
  .contact-phone-block > span{
    padding-left:0!important;
    margin-left:0!important;
    text-align:left!important;
  }

  /* Keep the contact card content perfectly left-aligned on phones. */
  .contact-email-block,
  .contact-phone-block{
    align-items:stretch!important;
  }
}

/* Careers upload: remove the ugly blue mobile tap/selection flash and keep it smooth. */
.cv-upload,
.cv-upload *,
.contact-copy-phone,
.contact-copy-phone *{
  -webkit-tap-highlight-color:transparent!important;
}

.cv-upload,
.cv-upload *,
.cv-upload-copy,
.cv-upload-copy *,
.cv-file-name{
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-touch-callout:none!important;
}

.cv-upload::selection,
.cv-upload *::selection{
  background:transparent!important;
  color:inherit!important;
}

.cv-upload:focus-within{
  background:rgba(30,143,98,.075)!important;
  border-color:rgba(18,112,78,.42)!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.12), 0 8px 18px rgba(8,39,31,.045)!important;
  transform:translateY(-1px)!important;
  outline:none!important;
}

.cv-upload:active{
  transform:scale(.995)!important;
}

/* Cleaner copy bubble. */
.copy-phone-feedback{
  letter-spacing:0!important;
}



/* ===== Source style block 2: anonymous ===== */

/* V4.11 — searchable international dial-code picker */
.phone-field{position:relative;display:grid;gap:7px;margin-bottom:16px;min-width:0}
.phone-field>label{font-size:12px;font-weight:800;color:#405048}
.phone-input-group{position:relative;display:flex;width:100%;border:1px solid #cedbd4;background:#fbfdfc;border-radius:12px;overflow:visible;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.phone-input-group:focus-within{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.13);background:#fff}
.phone-input-group input[type=tel]{flex:1;min-width:0;border:0!important;border-radius:0 12px 12px 0!important;background:transparent!important;box-shadow:none!important;padding:13px 14px!important}
/* Custom in-page dropdowns for form fields */
.form-custom-select{position:relative;width:100%;z-index:24}
.form-native-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;left:0!important;bottom:0!important;padding:0!important;border:0!important}
.form-select-trigger{width:100%;min-height:46px;border:1px solid #cedbd4;background:#fbfdfc;border-radius:12px;padding:0 13px 0 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--ink);font:inherit;font-size:14px;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:border-color .22s ease,box-shadow .22s ease,background .22s ease,transform .18s ease}
.form-select-trigger:hover{border-color:#adcdbd;background:#fff}
.form-select-trigger[aria-expanded="true"]{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.13);background:#fff}
.form-select-trigger:active{transform:scale(.995)}
.form-select-trigger:focus-visible{outline:none;border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.16)}
.form-custom-select.is-invalid .form-select-trigger{border-color:#c66;box-shadow:0 0 0 3px rgba(190,70,70,.10)}
.form-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.form-select-value.is-placeholder{color:#7b8882}
.form-select-chevron{width:17px;height:17px;flex:0 0 auto;color:#688078;transition:transform .26s cubic-bezier(.2,.8,.2,1)}
.form-select-trigger[aria-expanded="true"] .form-select-chevron{transform:rotate(180deg)}
.form-select-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:180;background:rgba(255,255,255,.99);border:1px solid rgba(16,106,75,.15);border-radius:15px;padding:6px;box-shadow:0 20px 50px rgba(7,48,35,.15);transform-origin:top center;animation:formSelectIn .2s cubic-bezier(.2,.8,.2,1);max-height:310px;overflow-y:auto;overscroll-behavior:contain}
.form-custom-select[data-custom-select="service"] .form-select-menu{padding-right:18px;scrollbar-width:none;-ms-overflow-style:none}
.form-custom-select[data-custom-select="service"] .form-select-menu::-webkit-scrollbar{width:0;height:0}
.other-service-field{max-height:0;opacity:0;overflow:hidden;transform:translateY(-10px);margin:-4px 0 0;pointer-events:none;transition:max-height .48s cubic-bezier(.2,.8,.2,1),opacity .28s ease,transform .48s cubic-bezier(.2,.8,.2,1),margin .48s cubic-bezier(.2,.8,.2,1)}
.other-service-field.is-visible{max-height:190px;opacity:1;transform:translateY(0);margin:10px 0 18px;pointer-events:auto}
.other-service-card{display:grid!important;gap:9px!important;margin:0!important;padding:16px 16px 17px!important;border:1px solid rgba(18,145,95,.28);border-left:4px solid #12865d;border-radius:16px;background:linear-gradient(135deg,rgba(230,247,238,.94),rgba(246,252,248,.98));box-shadow:0 10px 25px rgba(8,75,54,.07),inset 0 1px 0 rgba(255,255,255,.8)}
.other-service-card .other-service-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:900;color:#0b6849;letter-spacing:.015em}
.other-service-card .other-service-label:before{content:'+';width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#1a9a6b,#0d6c4e);color:#fff;font-size:15px;line-height:1;box-shadow:0 4px 10px rgba(8,75,54,.16)}
.other-service-card textarea{min-height:78px;background:rgba(255,255,255,.92)!important;border-color:rgba(18,134,93,.26)!important;resize:vertical}
.other-service-card textarea:focus{background:#fff!important;border-color:var(--green-600)!important;box-shadow:0 0 0 3px rgba(62,170,120,.13)!important}

.service-scroll-track{position:absolute;z-index:190;right:7px;top:calc(100% + 16px);width:5px;height:286px;border-radius:999px;background:rgba(14,95,68,.11);pointer-events:none;opacity:0;transform:scaleY(.96);transform-origin:center;transition:opacity .18s ease,transform .18s ease}
.service-scroll-track.is-visible{opacity:1;transform:scaleY(1)}
.service-scroll-thumb{position:absolute;left:0;right:0;top:var(--service-thumb-top,0px);height:var(--service-thumb-height,64px);border-radius:999px;background:linear-gradient(180deg,#1a9a6b,#0d6c4e);box-shadow:0 1px 4px rgba(8,75,54,.22);transition:top .08s linear}
@media(max-width:640px){.service-scroll-track{height:256px;right:7px;top:calc(100% + 16px)}}
.form-select-menu[hidden]{display:none}
.form-select-option{width:100%;border:0;background:transparent;border-radius:10px;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#26332e;font:inherit;font-size:13px;font-weight:750;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .16s ease,transform .16s ease,color .16s ease}
.form-select-option:hover,.form-select-option:focus-visible{background:#eff8f3;color:var(--green-900);outline:none}
.form-select-option:active{transform:scale(.992)}
.form-select-option.is-selected{background:#e6f5ed;color:var(--green-900)}
.form-select-option.is-selected:after{content:'✓';font-size:13px;font-weight:950;color:var(--green-700)}
@keyframes formSelectIn{from{opacity:0;transform:translateY(-5px) scale(.988)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:640px){.form-select-menu{max-height:280px}.form-select-option{padding:12px}}
.dial-picker{position:relative;flex:0 0 128px;z-index:35}
.dial-trigger{width:100%;height:100%;min-height:46px;border:0;border-right:1px solid #d8e2dd;background:linear-gradient(180deg,#f6faf8,#eef7f2);border-radius:11px 0 0 11px;padding:0 10px;display:grid;grid-template-columns:26px 1fr 15px;align-items:center;gap:6px;color:var(--green-900);font:inherit;font-weight:850;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .22s ease,color .22s ease}
.dial-trigger:hover,.dial-trigger[aria-expanded="true"]{background:#e8f5ee}
.dial-selected-flag{font-size:20px;line-height:1;filter:saturate(.92)}
.dial-selected-code{text-align:left;white-space:nowrap;font-variant-numeric:tabular-nums}
.dial-chevron{width:15px;height:15px;transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.dial-trigger[aria-expanded="true"] .dial-chevron{transform:rotate(180deg)}
.dial-menu{position:absolute;left:0;top:calc(100% + 9px);width:min(420px,calc(100vw - 42px));background:rgba(255,255,255,.985);border:1px solid rgba(16,106,75,.16);border-radius:18px;box-shadow:0 24px 60px rgba(7,48,35,.18);overflow:hidden;z-index:120;transform-origin:top left;animation:dialMenuIn .2s cubic-bezier(.2,.8,.2,1)}
@keyframes dialMenuIn{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.dial-search{margin:12px;display:flex;align-items:center;gap:9px;border:1px solid #d8e4de;background:#f7fbf9;border-radius:12px;padding:0 12px;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.dial-search:focus-within{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(62,170,120,.11);background:#fff}
.dial-search svg{width:18px;height:18px;color:#668079;flex:0 0 auto}
.dial-search input{width:100%!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:11px 0!important;font-size:14px!important;outline:none!important}
.dial-list{max-height:286px;overflow:auto;padding:0 7px 7px;scrollbar-width:thin;scrollbar-color:#b7c9c0 transparent}
.dial-group-title{padding:9px 10px 5px;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#7b8b84;position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(5px);z-index:1}
.dial-option{width:100%;border:0;background:transparent;border-radius:11px;display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:8px;padding:9px 10px;color:#26332e;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .16s ease,transform .16s ease}
.dial-option:hover,.dial-option:focus-visible{background:#eff8f3;outline:none}
.dial-option:active{transform:scale(.99)}
.dial-option.is-selected{background:#e6f5ed;color:var(--green-900)}
.dial-option-flag{font-size:20px;line-height:1}
.dial-option-name{font-size:13px;font-weight:720;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dial-option-code{font-size:12px;font-weight:900;color:#557069;font-variant-numeric:tabular-nums;white-space:nowrap}
.dial-empty{padding:22px 14px;text-align:center;color:#73827c;font-size:13px}
.dial-custom-wrap{border-top:1px solid #e6eeea;padding:7px;background:#fbfdfc}
.dial-custom-toggle{width:100%;border:0;background:transparent;border-radius:11px;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:10px;color:#31433b;font:inherit;cursor:pointer;text-align:left;transition:background .16s ease}
.dial-custom-toggle:hover{background:#eff8f3}
.dial-custom-title{font-size:13px;font-weight:800}
.dial-custom-plus{font-size:17px;font-weight:900;color:var(--green-700)}
.dial-custom-editor{display:grid;grid-template-columns:1fr auto;gap:8px;padding:7px 8px 5px}
.dial-custom-input-wrap{display:flex;align-items:center;border:1px solid #cedbd4;background:#fff;border-radius:10px;padding-left:11px;color:var(--green-900);font-weight:900}
.dial-custom-input{width:100%!important;border:0!important;background:transparent!important;box-shadow:none!important;padding:9px 8px!important;font-weight:850!important;letter-spacing:.04em}
.dial-custom-apply{border:0;border-radius:10px;background:linear-gradient(135deg,#137653,#0b5f43);color:#fff;padding:0 13px;font:inherit;font-size:12px;font-weight:850;cursor:pointer;box-shadow:0 7px 18px rgba(13,117,82,.16);transition:transform .16s ease,box-shadow .16s ease}
.dial-custom-apply:active{transform:scale(.97);box-shadow:0 4px 10px rgba(13,117,82,.13)}
@media(max-width:520px){.dial-picker{flex-basis:122px}.dial-menu{position:fixed;left:14px;right:14px;top:auto;bottom:16px;width:auto;max-height:min(70vh,530px);border-radius:22px;transform-origin:bottom center;animation:dialMenuMobileIn .24s cubic-bezier(.2,.8,.2,1)}.dial-list{max-height:min(43vh,310px)}@keyframes dialMenuMobileIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}}

/* ===== V4.43 — clean two-stage WhatsApp shine (no conflicting !important animation properties) ===== */
.btn-whatsapp-main,
.contact-action-btn.whatsapp{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(112deg,
    #119744 0%,
    #20bf59 33%,
    #55e98c 49%,
    #25d366 57%,
    #18ae50 70%,
    #0f843c 100%);
  background-size:220% 100%;
  background-position:0% 50%;
  border-color:#1eb857;
  box-shadow:0 10px 26px rgba(37,211,102,.22),inset 0 1px 0 rgba(255,255,255,.22);
  animation:ctaEmeraldShine 5.5s ease-in-out infinite;
}
.btn-whatsapp-main::after,
.contact-action-btn.whatsapp::after{
  content:"";
  position:absolute;
  z-index:2;
  top:-45%;
  bottom:-45%;
  width:24%;
  left:-38%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(255,255,255,.08) 22%,
    rgba(255,255,255,.42) 50%,
    rgba(255,255,255,.08) 78%,
    transparent 100%);
  filter:blur(.2px);
  pointer-events:none;
  animation:ctaGlassSweep 5.5s ease-in-out infinite;
}
.btn-whatsapp-main > *,
.contact-action-btn.whatsapp > *{
  position:relative;
  z-index:3;
}
.btn-whatsapp-main:hover,
.contact-action-btn.whatsapp:hover{
  color:#fff;
}
.contact-action-btn.whatsapp span{
  color:#fff;
  font-family:inherit;
  font-style:normal;
  font-size:14px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  text-transform:none;
}

/* Floating WhatsApp: exact width from rendered label; equal outer margins. */
.floating-whatsapp{
  --wa-expanded-width:285px;
}
.floating-whatsapp.is-expanded{
  width:min(var(--wa-expanded-width),calc(100vw - 20px))!important;
}
.floating-whatsapp.is-expanded svg{
  left:14px!important;
  transform:translate(0,-50%)!important;
}
.floating-whatsapp .wa-float-label{
  left:57px!important;
  right:14px!important;
  width:auto!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  text-align:left!important;
}
@media(max-width:640px){
  .floating-whatsapp{right:10px!important}
  .floating-whatsapp.is-expanded svg{left:12px!important}
  .floating-whatsapp .wa-float-label{
    left:54px!important;
    right:12px!important;
    font-size:13.5px!important;
  }
}


/* ===== V4.44 — clearer email cards + aligned EMAIL heading ===== */
.contact-email-block > span{
  padding-left:28px;
}
.contact-email-block .contact-inline-link{
  background:linear-gradient(135deg,
    rgba(25,130,90,.085) 0%,
    rgba(25,130,90,.060) 100%);
  border:1px solid rgba(18,112,78,.075);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 5px 14px rgba(8,39,31,.025);
}
.contact-email-block .contact-inline-link:hover{
  background:linear-gradient(135deg,
    rgba(25,130,90,.115) 0%,
    rgba(25,130,90,.080) 100%);
  border-color:rgba(18,112,78,.11);
}
@media(max-width:640px){
  .contact-email-block > span{
    padding-left:24px;
  }
}


/* ===== V4.45 — desktop contact rhythm + true two-phase process badge animation ===== */

/* Desktop contact: more breathing room and shared vertical rhythm. */
@media (min-width:981px){
  .contact-panel{
    grid-template-columns:.55fr 1.45fr!important;
    gap:56px!important;
  }

  .contact-links{
    grid-template-columns:minmax(180px,.9fr) minmax(330px,1.45fr) minmax(190px,.9fr)!important;
    column-gap:32px!important;
    row-gap:0!important;
    align-items:start!important;
  }

  .contact-phone-block,
  .contact-email-block{
    display:grid!important;
    grid-template-rows:18px 30px 56px 56px;
    row-gap:11px!important;
    align-content:start;
    padding:8px 0 10px!important;
  }

  .contact-phone-block > span,
  .contact-email-block > span{
    grid-row:1;
    align-self:start;
  }

  .contact-phone-block > strong{
    grid-row:2;
    align-self:start;
    padding-top:0!important;
    margin:0!important;
  }

  /* Let the two phone action buttons become rows 3 and 4 of the same grid. */
  .contact-phone-block .contact-actions{
    display:contents!important;
  }

  .contact-phone-block .contact-action-btn{
    width:100%!important;
    min-width:0!important;
    height:56px!important;
    margin:0!important;
    padding:0 18px!important;
    box-sizing:border-box;
  }

  .contact-email-block > span{
    padding-left:28px!important;
  }

  .contact-email-block .contact-inline-link{
    min-height:56px!important;
    margin:0!important;
    padding:12px 20px 12px 28px!important;
    justify-content:center!important;
    box-sizing:border-box;
  }

  .contact-email-block .contact-inline-link:nth-of-type(1){
    grid-row:3;
  }

  .contact-email-block .contact-inline-link:nth-of-type(2){
    grid-row:4;
  }

  .contact-email-block .contact-inline-link strong{
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:14px!important;
  }

  .contact-link-block:not(.contact-phone-block):not(.contact-email-block){
    padding:8px 0 10px!important;
  }
}

/* Process badges: two clearly separated motions.
   Phase 1 = emerald background travel.
   Phase 2 = glass highlight sweeps across afterwards. */
@keyframes processBadgeBgPhase{
  0%,70%,100%{background-position:0% 50%}
  80%{background-position:100% 50%}
  84%{background-position:100% 50%}
  88%{background-position:0% 50%}
}
@keyframes processBadgeGlassPhase{
  0%,84%{left:-44%;opacity:0}
  86%{left:-44%;opacity:.16}
  91%{opacity:.62}
  95%{left:118%;opacity:.58}
  98%,100%{left:118%;opacity:0}
}

.process-step span{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    linear-gradient(112deg,
      #0a4936 0%,
      #126e50 29%,
      #3eaa75 47%,
      #72dba4 53%,
      #21875f 67%,
      #093f30 100%)!important;
  background-size:230% 100%!important;
  background-position:0% 50%;
  animation:processBadgeBgPhase 5.5s ease-in-out infinite!important;
}

/* The previous pseudo-element sat behind the badge background.
   Keep it above the background so the second movement is actually visible. */
.process-step span::after{
  content:""!important;
  position:absolute!important;
  z-index:2!important;
  top:-48%!important;
  bottom:-48%!important;
  width:30%!important;
  left:-44%!important;
  transform:skewX(-18deg)!important;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.08) 22%,
    rgba(255,255,255,.46) 50%,
    rgba(255,255,255,.08) 78%,
    rgba(255,255,255,0) 100%)!important;
  mix-blend-mode:screen;
  pointer-events:none!important;
  animation:processBadgeGlassPhase 5.5s ease-in-out infinite!important;
}

@media (prefers-reduced-motion:reduce){
  .process-step span,
  .process-step span::after{
    animation:none!important;
  }
}


/* ===== V4.46 — contact restructure + robust two-stage numbered badge animation ===== */

/* Contact intro */
.contact-intro .eyebrow{
  margin-bottom:12px!important;
}
.contact-schedule{
  margin:0!important;
  max-width:260px;
  font-size:26px!important;
  line-height:1.18!important;
  letter-spacing:-.025em!important;
  color:var(--ink)!important;
}

/* "Formular de contact" fills the visual slot opposite the phone number. */
.contact-form-jump{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  width:max-content!important;
  max-width:100%;
  padding:0 15px!important;
  margin:0!important;
  border:1px solid rgba(18,112,78,.16)!important;
  border-radius:999px!important;
  background:rgba(25,130,90,.065)!important;
  color:var(--green-900)!important;
  text-decoration:none!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
  box-shadow:none!important;
  -webkit-tap-highlight-color:transparent;
  transition:background .22s ease,border-color .22s ease,transform .22s cubic-bezier(.2,.8,.2,1)!important;
}
.contact-form-jump:hover{
  background:rgba(25,130,90,.105)!important;
  border-color:rgba(18,112,78,.24)!important;
  transform:translateY(-1px);
}
.contact-form-jump:active{
  transform:scale(.985);
}

/* Desktop contact becomes two roomy columns: phone + email.
   Every item is put on the same four-row rhythm. */
@media (min-width:981px){
  .contact-panel{
    grid-template-columns:minmax(200px,.42fr) minmax(0,1.58fr)!important;
    gap:54px!important;
    align-items:start!important;
  }

  .contact-links{
    grid-template-columns:minmax(200px,.82fr) minmax(360px,1.18fr)!important;
    column-gap:54px!important;
    row-gap:0!important;
    align-items:start!important;
  }

  .contact-phone-block,
  .contact-email-block{
    display:grid!important;
    grid-template-rows:18px 36px 56px 56px!important;
    row-gap:11px!important;
    align-content:start!important;
    padding:8px 0 10px!important;
    min-width:0!important;
  }

  .contact-phone-block > span,
  .contact-email-block > span{
    grid-row:1!important;
    align-self:start!important;
    padding:0!important;
    margin:0!important;
  }

  .contact-phone-block > strong{
    grid-row:2!important;
    align-self:center!important;
    padding:0!important;
    margin:0!important;
    font-size:17px!important;
    line-height:1!important;
  }

  .contact-email-block .contact-form-jump{
    grid-row:2!important;
    align-self:center!important;
    justify-self:start!important;
  }

  .contact-phone-block .contact-actions{
    display:contents!important;
  }

  .contact-phone-block .contact-action-btn{
    width:100%!important;
    min-width:0!important;
    height:56px!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  .contact-email-block .contact-inline-link{
    min-height:56px!important;
    margin:0!important;
    padding:12px 22px 12px 26px!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }

  .contact-email-block .contact-inline-link:nth-of-type(2){
    grid-row:3!important;
  }
  .contact-email-block .contact-inline-link:nth-of-type(3){
    grid-row:4!important;
  }

  .contact-email-block .contact-inline-link strong{
    white-space:nowrap!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:14px!important;
  }
}

/* Mobile/tablet: keep the natural stacked layout and a compact schedule. */
@media (max-width:980px){
  .contact-schedule{
    max-width:none;
    font-size:24px!important;
  }
  .contact-form-jump{
    margin:2px 0 4px!important;
  }
}
@media (max-width:640px){
  .contact-schedule{
    font-size:22px!important;
  }
}

/* Numbered PROCESS badges:
   One element, two background layers, one keyframe.
   This avoids all earlier pseudo-element / z-index conflicts.

   Layer 1 = narrow white glass stripe (second movement)
   Layer 2 = emerald gradient body (first movement)
*/
@keyframes processBadgeTwoStage{
  0%,64%{
    background-position:-95% 50%, 0% 50%;
  }
  /* Movement 1: emerald body travels */
  76%{
    background-position:-95% 50%, 100% 50%;
  }
  80%{
    background-position:-95% 50%, 100% 50%;
  }
  /* Movement 2: glass stripe crosses AFTER the body movement */
  92%{
    background-position:185% 50%, 100% 50%;
  }
  96%{
    background-position:185% 50%, 0% 50%;
  }
  100%{
    background-position:-95% 50%, 0% 50%;
  }
}

.process-step span{
  position:relative!important;
  overflow:hidden!important;
  color:#fff!important;
  background-image:
    linear-gradient(108deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 31%,
      rgba(255,255,255,.12) 42%,
      rgba(255,255,255,.66) 50%,
      rgba(255,255,255,.12) 58%,
      rgba(255,255,255,0) 69%,
      rgba(255,255,255,0) 100%),
    linear-gradient(112deg,
      #084531 0%,
      #11694c 28%,
      #39a36f 44%,
      #78dda8 52%,
      #238860 65%,
      #073a2b 100%)!important;
  background-size:42% 220%, 235% 100%!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:-95% 50%,0% 50%;
  box-shadow:
    0 8px 20px rgba(13,59,46,.20),
    inset 0 1px 0 rgba(255,255,255,.17)!important;
  animation:processBadgeTwoStage 5.5s cubic-bezier(.4,0,.2,1) infinite!important;
}

/* Disable the old generated shine layer entirely so it cannot fight the new animation. */
.process-step span::after{
  content:none!important;
  animation:none!important;
}

/* Do not suppress these badges through older reduced-motion overrides.
   The site's other animation rules remain untouched. */
@media (prefers-reduced-motion:reduce){
  .process-step span{
    animation:processBadgeTwoStage 5.5s cubic-bezier(.4,0,.2,1) infinite!important;
  }
}


/* ===== V4.47 — isolated process animation + copy-phone bubble ===== */

/* Schedule: no separator; two deliberate lines. */
.contact-schedule{
  display:flex!important;
  flex-direction:column!important;
  gap:4px!important;
}
.contact-schedule > span{
  display:block!important;
}

/* Phone number now mirrors the "Formular de contact" bubble. */
.contact-copy-phone{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  min-height:34px!important;
  width:max-content!important;
  max-width:100%!important;
  padding:0 15px!important;
  margin:0!important;
  border:1px solid rgba(18,112,78,.16)!important;
  border-radius:999px!important;
  background:rgba(25,130,90,.065)!important;
  color:var(--green-900)!important;
  font:inherit!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  cursor:pointer!important;
  box-shadow:none!important;
  -webkit-tap-highlight-color:transparent!important;
  transition:background .22s ease,border-color .22s ease,transform .22s cubic-bezier(.2,.8,.2,1)!important;
}
.contact-copy-phone:hover{
  background:rgba(25,130,90,.105)!important;
  border-color:rgba(18,112,78,.24)!important;
  transform:translateY(-1px)!important;
}
.contact-copy-phone:active{
  transform:scale(.985)!important;
}
.copy-phone-feedback{
  position:absolute;
  left:50%;
  bottom:calc(100% + 7px);
  transform:translate(-50%,5px);
  opacity:0;
  pointer-events:none;
  white-space:nowrap;
  padding:5px 8px;
  border-radius:8px;
  background:#0b4c38;
  color:#fff;
  font-size:10px;
  font-weight:850;
  box-shadow:0 6px 14px rgba(8,39,31,.16);
  transition:opacity .18s ease,transform .18s ease;
}
.contact-copy-phone.is-copied .copy-phone-feedback{
  opacity:1;
  transform:translate(-50%,0);
}

/* Keep the phone bubble and form-jump bubble on the same desktop row and scale. */
@media (min-width:981px){
  .contact-phone-block .contact-copy-phone{
    grid-row:2!important;
    align-self:center!important;
    justify-self:start!important;
  }
  .contact-email-block .contact-form-jump{
    grid-row:2!important;
    align-self:center!important;
    justify-self:start!important;
  }
  .contact-phone-block,
  .contact-email-block{
    grid-template-rows:18px 36px 56px 56px!important;
  }
}

/* ----------------------------------------------
   PROCESS 01–04: fresh, isolated two-motion setup
   ---------------------------------------------- */

/* Base badge. Old .process-step span rules may still exist, but this selector is
   more specific and all animation is moved to two separate pseudo-elements. */
.process-step .process-number{
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  overflow:hidden!important;
  background:#0b513b!important;
  background-image:none!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(13,59,46,.20),inset 0 1px 0 rgba(255,255,255,.16)!important;
  animation:none!important;
}

.process-step .process-number > b{
  position:relative!important;
  z-index:5!important;
  display:block!important;
  color:#fff!important;
  font:inherit!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1!important;
  text-shadow:0 1px 2px rgba(0,0,0,.10);
}

/* Motion 1: emerald gradient visibly travels across the whole badge. */
.process-step .process-number::before{
  content:""!important;
  position:absolute!important;
  z-index:1!important;
  top:0!important;
  bottom:0!important;
  left:-78%!important;
  width:190%!important;
  border-radius:inherit!important;
  background:linear-gradient(112deg,
    #084531 0%,
    #0c5940 18%,
    #17805b 36%,
    #56c88e 50%,
    #87e3b1 56%,
    #278f66 68%,
    #0a4936 84%,
    #073a2b 100%)!important;
  transform:translateX(0)!important;
  opacity:1!important;
  pointer-events:none!important;
  animation:processEmeraldPass 5.8s cubic-bezier(.35,0,.22,1) infinite!important;
}

/* Motion 2: distinct white glass strip, starts AFTER the emerald movement. */
.process-step .process-number::after{
  content:""!important;
  position:absolute!important;
  z-index:3!important;
  top:-40%!important;
  bottom:-40%!important;
  left:-52%!important;
  width:24%!important;
  border-radius:50%!important;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 26%,
    rgba(255,255,255,.72) 50%,
    rgba(255,255,255,.10) 74%,
    rgba(255,255,255,0) 100%)!important;
  transform:skewX(-18deg)!important;
  opacity:0!important;
  pointer-events:none!important;
  animation:processGlassPass 5.8s cubic-bezier(.35,0,.22,1) infinite!important;
}

@keyframes processEmeraldPass{
  0%,59%{
    transform:translateX(0);
  }
  72%{
    transform:translateX(42%);
  }
  78%{
    transform:translateX(42%);
  }
  79%{
    opacity:1;
  }
  80%{
    opacity:0;
    transform:translateX(0);
  }
  82%,100%{
    opacity:1;
    transform:translateX(0);
  }
}

@keyframes processGlassPass{
  0%,81%{
    left:-52%;
    opacity:0;
  }
  83%{
    left:-52%;
    opacity:.18;
  }
  91%{
    left:118%;
    opacity:.68;
  }
  95%,100%{
    left:118%;
    opacity:0;
  }
}

/* Explicitly beat all older reduced-motion rules for these four badges only. */
@media (prefers-reduced-motion:reduce){
  .process-step .process-number::before{
    animation:processEmeraldPass 5.8s cubic-bezier(.35,0,.22,1) infinite!important;
  }
  .process-step .process-number::after{
    animation:processGlassPass 5.8s cubic-bezier(.35,0,.22,1) infinite!important;
  }
}


/* ===== V4.48 — verified isolated process animation + contact polish ===== */

/* Requested black labels. */
.contact-phone-block > span,
.contact-email-block > span{
  color:var(--ink)!important;
}

/* Same dark tone as the "Formular de contact" bubble. */
.contact-copy-phone,
.contact-copy-phone .copy-phone-value{
  color:var(--green-900)!important;
}

/* Smoother, clearer clipboard confirmation. */
.copy-phone-feedback{
  bottom:calc(100% + 11px)!important;
  min-width:max-content!important;
  padding:9px 13px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#0a4634,#12694d)!important;
  color:#fff!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:.01em!important;
  box-shadow:0 12px 30px rgba(8,39,31,.22)!important;
  opacity:0!important;
  transform:translate(-50%,10px) scale(.92)!important;
  filter:blur(2px)!important;
  transition:
    opacity .30s cubic-bezier(.2,.8,.2,1),
    transform .38s cubic-bezier(.16,1,.3,1),
    filter .30s ease!important;
}
.contact-copy-phone.is-copied{
  background:rgba(25,130,90,.105)!important;
  border-color:rgba(18,112,78,.25)!important;
  box-shadow:0 0 0 3px rgba(45,139,99,.07)!important;
  transition:background .28s ease,border-color .28s ease,box-shadow .28s ease,transform .22s ease!important;
}
.contact-copy-phone.is-copied .copy-phone-feedback{
  opacity:1!important;
  transform:translate(-50%,0) scale(1)!important;
  filter:blur(0)!important;
}

/* ------------------------------------------------------------------
   PROCESS 01–04
   Old pseudo-element animations are completely disabled.
   Animation now lives on NEW child layers that no previous CSS targets.
   ------------------------------------------------------------------ */
.process-step .process-number{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  padding:0!important;
  border:0!important;
  border-radius:13px!important;
  background:#0b513b!important;
  background-image:none!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(13,59,46,.20),inset 0 1px 0 rgba(255,255,255,.18)!important;
  animation:none!important;
}

/* Remove every legacy generated animation layer. */
.process-step .process-number::before,
.process-step .process-number::after{
  content:none!important;
  display:none!important;
  animation:none!important;
}

/* Movement 1 — EXACT ctaEmeraldShine keyframes used by the working hero CTA. */
.process-badge-bg{
  position:absolute;
  z-index:1;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(
    112deg,
    #0b513b 0%,
    #16845e 34%,
    #43b67d 50%,
    #117351 64%,
    #0a4b37 100%
  );
  background-size:220% 100%;
  background-position:0% 50%;
  pointer-events:none;
  animation:ctaEmeraldShine 5.5s ease-in-out infinite;
}

/* Movement 2 — EXACT ctaGlassSweep keyframes used by the working hero CTA. */
.process-badge-glass{
  position:absolute;
  z-index:3;
  top:-45%;
  bottom:-45%;
  width:24%;
  left:-38%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);
  filter:blur(.2px);
  opacity:0;
  pointer-events:none;
  animation:ctaGlassSweep 5.5s ease-in-out infinite;
}

.process-step .process-number > b{
  position:relative!important;
  z-index:5!important;
  display:block!important;
  color:#fff!important;
  font:inherit!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:950!important;
  text-shadow:0 1px 2px rgba(0,0,0,.10);
}


/* ===== V4.49 — services top transition: hard white→green + recessed shadow only ===== */

/* Keep the service field itself solid emerald. */
.services-stage{
  background:#0d4635!important;
  box-shadow:
    inset 0 18px 20px -18px rgba(0,24,17,.78),
    inset 0 7px 10px -8px rgba(0,0,0,.28)!important;
}

/* Remove ONLY the upper color gradient. The bottom transition stays untouched. */
.services-stage::before{
  content:none!important;
  display:none!important;
  background:none!important;
}

/* Same idea on tablet/mobile: direct edge, slightly tighter shadow. */
@media(max-width:980px){
  .services-stage{
    box-shadow:
      inset 0 17px 19px -17px rgba(0,24,17,.76),
      inset 0 6px 9px -7px rgba(0,0,0,.27)!important;
  }
}

@media(max-width:640px){
  .services-stage{
    box-shadow:
      inset 0 15px 18px -16px rgba(0,24,17,.74),
      inset 0 6px 9px -7px rgba(0,0,0,.25)!important;
  }
}


/* ===== V4.50 — same hard recessed transition for trust strip + footer ===== */

/* Trust strip: solid emerald, no gradient; recessed under white both top and bottom. */
.trust-strip{
  border:0!important;
  background:#0d4635!important;
  box-shadow:
    inset 0 18px 20px -18px rgba(0,24,17,.78),
    inset 0 -18px 20px -18px rgba(0,24,17,.70),
    inset 0 7px 10px -8px rgba(0,0,0,.24),
    inset 0 -7px 10px -8px rgba(0,0,0,.20)!important;
}

/* Footer: hard white → dark green edge, with green visually sitting below the white section. */
.site-footer{
  border-top:0!important;
  background:#071d17!important;
  box-shadow:
    inset 0 20px 22px -20px rgba(0,12,9,.88),
    inset 0 7px 10px -8px rgba(0,0,0,.34)!important;
}

@media(max-width:980px){
  .trust-strip{
    box-shadow:
      inset 0 17px 19px -17px rgba(0,24,17,.76),
      inset 0 -17px 19px -17px rgba(0,24,17,.68),
      inset 0 6px 9px -7px rgba(0,0,0,.23),
      inset 0 -6px 9px -7px rgba(0,0,0,.19)!important;
  }
  .site-footer{
    box-shadow:
      inset 0 18px 20px -18px rgba(0,12,9,.86),
      inset 0 6px 9px -7px rgba(0,0,0,.32)!important;
  }
}

@media(max-width:640px){
  .trust-strip{
    box-shadow:
      inset 0 15px 18px -16px rgba(0,24,17,.74),
      inset 0 -15px 18px -16px rgba(0,24,17,.66),
      inset 0 6px 9px -7px rgba(0,0,0,.22),
      inset 0 -6px 9px -7px rgba(0,0,0,.18)!important;
  }
  .site-footer{
    box-shadow:
      inset 0 16px 18px -16px rgba(0,12,9,.84),
      inset 0 6px 9px -7px rgba(0,0,0,.30)!important;
  }
}


/* ===== V4.51 — smooth company field + localized validation ===== */

/* Unlike .hidden, this can animate in both directions. */
.company-field{
  display:grid!important;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transform:translateY(-10px);
  margin:-4px 0 0!important;
  padding:0;
  pointer-events:none;
  visibility:hidden;
  transition:
    max-height .48s cubic-bezier(.2,.8,.2,1),
    opacity .28s ease,
    transform .48s cubic-bezier(.2,.8,.2,1),
    margin .48s cubic-bezier(.2,.8,.2,1),
    visibility 0s linear .48s;
}

.company-field.is-visible{
  max-height:110px;
  opacity:1;
  transform:translateY(0);
  margin:10px 0 16px!important;
  pointer-events:auto;
  visibility:visible;
  transition:
    max-height .48s cubic-bezier(.2,.8,.2,1),
    opacity .30s ease .06s,
    transform .48s cubic-bezier(.2,.8,.2,1),
    margin .48s cubic-bezier(.2,.8,.2,1),
    visibility 0s linear 0s;
}

/* Tiny green contextual accent, analogous to the special "Alt serviciu" field,
   but quieter because this is a normal B2B branch of the form. */
.company-field.is-visible{
  padding:12px 14px 14px;
  border:1px solid rgba(18,145,95,.16);
  border-left:3px solid rgba(18,134,93,.72);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(237,249,243,.78),rgba(250,253,251,.94));
}

.company-field.is-visible > span{
  color:#285b48;
}

@media(max-width:640px){
  .company-field.is-visible{
    max-height:120px;
  }
}


/* ===== V4.52 — company field fix + refined contact typography ===== */

/* Company field: same smooth contextual reveal philosophy as "Alt serviciu".
   Padding, border and background now transition too, so nothing pops abruptly. */
.company-field{
  display:grid!important;
  gap:0!important;
  max-height:0!important;
  opacity:0!important;
  overflow:hidden!important;
  transform:translateY(-10px)!important;
  margin:-4px 0 0!important;
  padding:0 14px!important;
  border:1px solid transparent!important;
  border-left:3px solid transparent!important;
  border-radius:14px!important;
  background:rgba(247,252,249,0)!important;
  pointer-events:none!important;
  visibility:hidden!important;
  transition:
    max-height .50s cubic-bezier(.2,.8,.2,1),
    opacity .30s ease,
    transform .50s cubic-bezier(.2,.8,.2,1),
    margin .50s cubic-bezier(.2,.8,.2,1),
    padding .50s cubic-bezier(.2,.8,.2,1),
    border-color .34s ease,
    background-color .38s ease,
    visibility 0s linear .50s!important;
}

.company-field.is-visible{
  gap:9px!important;
  max-height:150px!important;
  opacity:1!important;
  transform:translateY(0)!important;
  margin:10px 0 16px!important;
  padding:13px 14px 15px!important;
  border-color:rgba(18,145,95,.18)!important;
  border-left-color:#12865d!important;
  background:rgba(241,250,245,.92)!important;
  pointer-events:auto!important;
  visibility:visible!important;
  transition:
    max-height .50s cubic-bezier(.2,.8,.2,1),
    opacity .32s ease .05s,
    transform .50s cubic-bezier(.2,.8,.2,1),
    margin .50s cubic-bezier(.2,.8,.2,1),
    padding .50s cubic-bezier(.2,.8,.2,1),
    border-color .34s ease .04s,
    background-color .38s ease .04s,
    visibility 0s linear 0s!important;
}

.company-field > span{
  transition:color .28s ease,opacity .28s ease!important;
}
.company-field.is-visible > span{
  color:#285b48!important;
}

/* Contact hierarchy: labels are now crisp/readable, while CONTACT stays clearly larger. */
.contact-phone-block > span,
.contact-email-block > span{
  font-size:14px!important;
  line-height:1.2!important;
  letter-spacing:.075em!important;
  font-weight:900!important;
  color:#111915!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

.contact-panel .contact-intro .eyebrow{
  font-size:24px!important;
  line-height:1.15!important;
  letter-spacing:.075em!important;
  font-weight:950!important;
}

@media(max-width:640px){
  .company-field.is-visible{
    max-height:160px!important;
  }
  .contact-phone-block > span,
  .contact-email-block > span{
    font-size:13px!important;
  }
  .contact-panel .contact-intro .eyebrow{
    font-size:21px!important;
  }
}


/* ===== V4.53 — WhatsApp hover consistency + shiny hero eyebrow ===== */

/* WhatsApp buttons keep the exact same animated surface on hover.
   Hover only adds the same subtle lift/shadow language as the dark-green CTAs. */
.btn-whatsapp-main,
.contact-action-btn.whatsapp{
  transition:
    transform .20s ease,
    box-shadow .20s ease,
    border-color .20s ease!important;
}

.btn-whatsapp-main:hover,
.contact-action-btn.whatsapp:hover{
  color:#fff!important;
  background-image:linear-gradient(
    112deg,
    #119744 0%,
    #20bf59 33%,
    #55e98c 49%,
    #25d366 57%,
    #18ae50 70%,
    #0f843c 100%
  )!important;
  background-size:220% 100%!important;
  border-color:#1eb857!important;
  transform:translateY(-2px)!important;
  box-shadow:
    0 14px 30px rgba(37,211,102,.28),
    inset 0 1px 0 rgba(255,255,255,.24)!important;
}

/* Hero eyebrow: slightly larger and animated with the same emerald-light language.
   We reuse the already-working shine timing rather than adding another animation. */
.hero [data-i18n="hero_eyebrow"]{
  display:inline-block!important;
  font-size:19px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.085em!important;
  color:transparent!important;
  background:linear-gradient(
    112deg,
    #0a4f38 0%,
    #14835b 30%,
    #40b77b 46%,
    #83e2ae 53%,
    #259264 64%,
    #0b6244 100%
  )!important;
  background-size:220% 100%!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  text-shadow:0 6px 20px rgba(31,107,79,.10);
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.48));
  animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
}

@media(max-width:640px){
  .hero [data-i18n="hero_eyebrow"]{
    font-size:18px!important;
    letter-spacing:.075em!important;
  }
}


/* ===== V4.54 — visible two-layer shine for "Strălucim din 2008" ===== */
@keyframes heroEyebrowShine{
  0%,68%,100%{
    background-position:-140% 50%, 0% 50%;
  }
  78%{
    background-position:-140% 50%, 100% 50%;
  }
  88%{
    background-position:220% 50%, 100% 50%;
  }
  94%{
    background-position:220% 50%, 0% 50%;
  }
}

.hero [data-i18n="hero_eyebrow"]{
  display:inline-block!important;
  font-size:20px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.085em!important;

  color:transparent!important;
  -webkit-text-fill-color:transparent!important;

  background-image:
    linear-gradient(
      105deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 34%,
      rgba(220,255,235,.16) 43%,
      rgba(255,255,255,.92) 50%,
      rgba(220,255,235,.16) 57%,
      rgba(255,255,255,0) 66%,
      rgba(255,255,255,0) 100%
    ),
    linear-gradient(
      112deg,
      #07533a 0%,
      #11825a 28%,
      #35b477 44%,
      #7be0a9 52%,
      #289766 64%,
      #0b6244 100%
    )!important;

  background-size:55% 100%, 220% 100%!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:-140% 50%,0% 50%;
  -webkit-background-clip:text!important;
  background-clip:text!important;

  text-shadow:none!important;
  filter:drop-shadow(0 2px 5px rgba(21,101,72,.12));
  animation:heroEyebrowShine 5.5s cubic-bezier(.35,0,.2,1) infinite!important;
}

@media(max-width:640px){
  .hero [data-i18n="hero_eyebrow"]{
    font-size:19px!important;
    letter-spacing:.075em!important;
  }
}


/* ===== V4.55 — isolated hero text shine + narrower balanced hero card ===== */

/* Wrapper owns geometry only; old data-i18n eyebrow rules cannot control the glass layer. */
.hero-eyebrow-shine{
  position:relative!important;
  display:inline-grid!important;
  width:max-content!important;
  max-width:100%;
  margin:0!important;
  line-height:1.2!important;
}

/* Movement 1 — literal CTA emerald engine, clipped into the real text. */
.hero-eyebrow-shine .hero-eyebrow-text{
  grid-area:1/1!important;
  position:relative!important;
  z-index:1!important;
  display:block!important;

  font-size:20px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.085em!important;

  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(
    112deg,
    #0b513b 0%,
    #16845e 34%,
    #43b67d 50%,
    #117351 64%,
    #0a4b37 100%
  )!important;
  background-size:220% 100%!important;
  background-position:0% 50%;
  background-repeat:no-repeat!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;

  text-shadow:none!important;
  filter:drop-shadow(0 2px 4px rgba(21,101,72,.10))!important;
  animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
}

/* Movement 2 — a second copy of the SAME text, only carrying the glass band.
   It uses the same 73/76/84/88 timing points as ctaGlassSweep. */
@keyframes heroTextGlassSweep{
  0%,73%{
    background-position:-85% 50%;
    opacity:0;
  }
  76%{
    background-position:-85% 50%;
    opacity:.18;
  }
  84%{
    background-position:185% 50%;
    opacity:1;
  }
  88%,100%{
    background-position:185% 50%;
    opacity:0;
  }
}

.hero-eyebrow-shine .hero-eyebrow-glass{
  grid-area:1/1!important;
  position:relative!important;
  z-index:3!important;
  display:block!important;
  pointer-events:none!important;

  font-size:20px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.085em!important;

  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 35%,
    rgba(226,255,237,.20) 43%,
    rgba(255,255,255,.98) 50%,
    rgba(226,255,237,.20) 57%,
    rgba(255,255,255,0) 65%,
    rgba(255,255,255,0) 100%
  )!important;
  background-size:42% 100%!important;
  background-repeat:no-repeat!important;
  background-position:-85% 50%;
  -webkit-background-clip:text!important;
  background-clip:text!important;

  filter:drop-shadow(0 0 2px rgba(255,255,255,.24))!important;
  opacity:0;
  animation:heroTextGlassSweep 5.5s ease-in-out infinite!important;
}

/* Desktop: physically shrink the entire service card so its contents no longer
   sit in a visually oversized rectangle. */
@media (min-width:981px){
  .hero-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(470px,.75fr)!important;
    gap:58px!important;
  }

  .hero-card{
    width:500px!important;
    max-width:100%!important;
    justify-self:end!important;
  }

  .hero-card-body{
    padding-left:32px!important;
    padding-right:32px!important;
  }

  .hero-card .phone-link{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Medium desktop/laptop: keep it narrow but allow safe shrinking. */
@media (min-width:981px) and (max-width:1180px){
  .hero-grid{
    grid-template-columns:minmax(0,1.12fr) minmax(430px,.88fr)!important;
    gap:42px!important;
  }
  .hero-card{
    width:460px!important;
  }
}

@media(max-width:980px){
  .hero-card{
    width:min(100%,560px)!important;
    justify-self:center!important;
  }
  .hero-card .phone-link{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

@media(max-width:640px){
  .hero-eyebrow-shine .hero-eyebrow-text,
  .hero-eyebrow-shine .hero-eyebrow-glass{
    font-size:19px!important;
    letter-spacing:.075em!important;
  }
}

/* Keep these two text animations alive even if older reduced-motion rules target
   .btn-hero-shine. They are isolated and no longer inherit those rules. */
@media (prefers-reduced-motion:reduce){
  .hero-eyebrow-shine .hero-eyebrow-text{
    animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
  }
  .hero-eyebrow-shine .hero-eyebrow-glass{
    animation:heroTextGlassSweep 5.5s ease-in-out infinite!important;
  }
}


/* ===== V4.56 — full-width sweep across the entire "Strălucim din 2008" text ===== */

/*
  The previous glass layer used a narrow 42% gradient and percentages that made
  the highlight look like it was lighting individual letters.
  This version uses a much wider highlight band and moves the BACKGROUND across
  the full text width, so the sweep reads as one continuous pass.
*/
@keyframes heroTextFullSweep{
  0%,72%{
    background-position:180% 50%;
    opacity:0;
  }
  75%{
    background-position:180% 50%;
    opacity:.16;
  }
  79%{
    opacity:.72;
  }
  86%{
    background-position:-80% 50%;
    opacity:1;
  }
  90%{
    background-position:-80% 50%;
    opacity:.32;
  }
  93%,100%{
    background-position:-80% 50%;
    opacity:0;
  }
}

.hero-eyebrow-shine .hero-eyebrow-glass{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;

  /* broad highlight: several letters are illuminated at once */
  background-image:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0) 20%,
    rgba(213,255,231,.14) 31%,
    rgba(233,255,242,.38) 39%,
    rgba(255,255,255,.98) 50%,
    rgba(233,255,242,.38) 61%,
    rgba(213,255,231,.14) 69%,
    rgba(255,255,255,0) 80%,
    rgba(255,255,255,0) 100%
  )!important;

  /* Much wider than before so the effect spans words, not one letter. */
  background-size:165% 100%!important;
  background-repeat:no-repeat!important;
  background-position:180% 50%;

  -webkit-background-clip:text!important;
  background-clip:text!important;

  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.32))
    drop-shadow(0 0 5px rgba(133,230,177,.12))!important;

  opacity:0;
  animation:heroTextFullSweep 5.5s cubic-bezier(.35,0,.2,1) infinite!important;
}

/* Keep base emerald movement intact and independent. */
.hero-eyebrow-shine .hero-eyebrow-text{
  animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
}

@media(max-width:640px){
  .hero-eyebrow-shine .hero-eyebrow-glass{
    background-size:175% 100%!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-eyebrow-shine .hero-eyebrow-text{
    animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
  }
  .hero-eyebrow-shine .hero-eyebrow-glass{
    animation:heroTextFullSweep 5.5s cubic-bezier(.35,0,.2,1) infinite!important;
  }
}


/* ===== V4.57 — VERIFIED full-string shine sweep =====
   Base motion = exact working CTA emerald motion.
   Glass motion = clipped full duplicate text, tested across the entire string.
*/
@keyframes heroTextClipSweep{
  0%,73%{
    clip-path:polygon(-48% -20%,-6% -20%,-18% 120%,-60% 120%);
    opacity:0;
  }
  76%{
    clip-path:polygon(-48% -20%,-6% -20%,-18% 120%,-60% 120%);
    opacity:.28;
  }
  84%{
    clip-path:polygon(106% -20%,148% -20%,136% 120%,94% 120%);
    opacity:.96;
  }
  88%,100%{
    clip-path:polygon(106% -20%,148% -20%,136% 120%,94% 120%);
    opacity:0;
  }
}

/* First movement: same emerald engine as the working shiny buttons. */
.hero-eyebrow-shine .hero-eyebrow-text{
  animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
}

/* Second movement:
   white duplicate of the WHOLE phrase, revealed by a wide slanted window
   that physically travels from before the first letter to beyond 2008. */
.hero-eyebrow-shine .hero-eyebrow-glass{
  grid-area:1/1!important;
  position:relative!important;
  z-index:3!important;
  display:block!important;
  pointer-events:none!important;

  font-size:20px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:.085em!important;

  color:#f7fff9!important;
  -webkit-text-fill-color:#f7fff9!important;
  background:none!important;
  background-image:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;

  filter:
    drop-shadow(0 0 2px rgba(255,255,255,.45))
    drop-shadow(0 0 7px rgba(121,224,169,.18))!important;

  clip-path:polygon(-48% -20%,-6% -20%,-18% 120%,-60% 120%);
  opacity:0;
  animation:heroTextClipSweep 5.5s cubic-bezier(.35,0,.2,1) infinite!important;
}

@media(max-width:640px){
  .hero-eyebrow-shine .hero-eyebrow-glass{
    font-size:19px!important;
    letter-spacing:.075em!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-eyebrow-shine .hero-eyebrow-text{
    animation:ctaEmeraldShine 5.5s ease-in-out infinite!important;
  }
  .hero-eyebrow-shine .hero-eyebrow-glass{
    animation:heroTextClipSweep 5.5s cubic-bezier(.35,0,.2,1) infinite!important;
  }
}


/* ===== V4.58 — slightly larger main service area label ===== */
.coverage-card span[data-i18n="coverage_label"]{
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.085em!important;
  color:var(--green-700)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

@media(max-width:640px){
  .coverage-card span[data-i18n="coverage_label"]{
    font-size:13px!important;
  }
}


/* ===== V4.59 — service dropdown scrollbar visible on desktop too ===== */
.form-custom-select[data-custom-select="service"].is-open{
  z-index:780!important;
}
.form-custom-select[data-custom-select="service"].is-open .form-select-menu{
  z-index:750!important;
}
.form-custom-select[data-custom-select="service"] .service-scroll-track{
  z-index:770!important;
  width:6px!important;
  right:8px!important;
  background:rgba(11,82,59,.14)!important;
  box-shadow:inset 0 0 0 1px rgba(10,78,56,.06)!important;
}
.form-custom-select[data-custom-select="service"] .service-scroll-track.is-visible{
  opacity:1!important;
  visibility:visible!important;
  transform:scaleY(1)!important;
}
.form-custom-select[data-custom-select="service"] .service-scroll-thumb{
  background:linear-gradient(180deg,#28ad78 0%,#0d6c4e 100%)!important;
  box-shadow:0 2px 6px rgba(8,75,54,.26)!important;
}
@media(min-width:641px){
  .form-custom-select[data-custom-select="service"] .service-scroll-track{
    right:8px!important;
    width:6px!important;
  }
}


/* ===== V4.60 — real Facebook link in footer ===== */
.footer-facebook{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  width:max-content;
  color:#aebfb7!important;
  text-decoration:none!important;
  -webkit-tap-highlight-color:transparent;
  transition:color .2s ease,transform .2s ease!important;
}
.footer-facebook svg{
  width:13px!important;
  height:13px!important;
  flex:0 0 13px;
  fill:#1877f2;
  filter:drop-shadow(0 2px 4px rgba(24,119,242,.14));
  transition:transform .2s ease,filter .2s ease!important;
}
.footer-facebook span{
  color:inherit!important;
  font-size:13px!important;
}
.footer-facebook:hover{
  color:#fff!important;
  transform:translateY(-1px);
}
.footer-facebook:hover svg{
  transform:scale(1.08);
  filter:drop-shadow(0 3px 6px rgba(24,119,242,.22));
}


/* ===== V4.61 — compact recruitment / CV section ===== */
.careers-section{
  padding:10px 0 46px;
  background:#f5f7f5;
}

.careers-card{
  width:min(100%,980px);
  margin:0 auto;
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:34px;
  align-items:center;
  padding:30px;
  border:1px solid rgba(16,106,75,.12);
  border-radius:26px;
  background:
    radial-gradient(circle at 7% 12%,rgba(113,220,166,.09),transparent 33%),
    linear-gradient(135deg,rgba(250,253,251,.98),rgba(241,249,245,.96));
  box-shadow:0 18px 48px rgba(8,39,31,.07);
}

.careers-copy{
  padding:4px 6px;
}
.careers-eyebrow{
  margin:0 0 12px!important;
  font-size:14px!important;
  color:var(--green-700)!important;
}
.careers-copy h2{
  margin:0 0 13px;
  max-width:410px;
  font-size:34px;
  line-height:1.04;
  letter-spacing:-.035em;
}
.careers-copy>p:not(.eyebrow){
  margin:0;
  max-width:440px;
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
}
.careers-note{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:18px;
  color:#41675a;
  font-size:12px;
  font-weight:750;
}
.careers-note-dot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#35c982;
  box-shadow:0 0 0 5px rgba(53,201,130,.11);
}

.careers-form{
  padding:20px;
  border:1px solid rgba(16,106,75,.11);
  border-radius:20px;
  background:rgba(255,255,255,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.careers-form label:not(.cv-upload):not(.careers-check){
  display:grid;
  gap:6px;
  margin-bottom:12px;
  font-size:11px;
  font-weight:850;
  color:#34483f;
}
.careers-field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:11px;
}
.careers-form input[type="text"],
.careers-form input[type="tel"],
.careers-form input[type="email"]{
  width:100%;
  height:43px;
  box-sizing:border-box;
  padding:0 12px;
  border:1px solid #cedbd4;
  border-radius:11px;
  outline:none;
  background:#fbfdfc;
  color:var(--ink);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.careers-form input:focus{
  border-color:var(--green-600);
  background:#fff;
  box-shadow:0 0 0 3px rgba(62,170,120,.11);
}

.cv-upload{
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  min-height:64px;
  margin:2px 0 12px;
  padding:10px 12px;
  border:1px dashed rgba(18,112,78,.28);
  border-radius:14px;
  background:rgba(30,143,98,.045);
  cursor:pointer;
  overflow:hidden;
  transition:background .22s ease,border-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.cv-upload:hover{
  background:rgba(30,143,98,.075);
  border-color:rgba(18,112,78,.42);
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(8,39,31,.045);
}
.cv-file-input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.cv-upload-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:linear-gradient(145deg,#0c5c43,#169267);
  color:#fff;
  box-shadow:0 7px 16px rgba(13,91,66,.16);
}
.cv-upload-icon svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.cv-upload-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.cv-upload-copy strong{
  color:#173d30;
  font-size:12px;
}
.cv-upload-copy small{
  color:var(--muted);
  font-size:10px;
}
.cv-file-name{
  max-width:125px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:7px 9px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(18,112,78,.11);
  color:#2c5c49;
  font-size:10px;
  font-weight:800;
}

.careers-check{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:0 0 13px;
  color:var(--muted);
  font-size:10px;
  line-height:1.4;
  cursor:pointer;
}
.careers-check input{
  width:15px;
  height:15px;
  margin:1px 0 0;
  flex:0 0 15px;
}

.careers-submit{
  width:100%;
  min-height:44px;
  border:0;
}
.careers-status{
  min-height:0;
  margin:8px 0 0;
  color:#2b6952;
  font-size:10px;
  line-height:1.45;
  text-align:center;
  opacity:0;
  transform:translateY(4px);
  transition:opacity .25s ease,transform .25s ease;
}
.careers-status.is-visible{
  opacity:1;
  transform:translateY(0);
}

@media(max-width:980px){
  .careers-section{padding:8px 0 38px}
  .careers-card{
    grid-template-columns:1fr;
    gap:24px;
    width:min(100%,720px);
  }
  .careers-copy h2,
  .careers-copy>p:not(.eyebrow){
    max-width:none;
  }
}
@media(max-width:640px){
  .careers-section{padding:6px 0 30px}
  .careers-card{
    padding:20px;
    border-radius:22px;
    gap:20px;
  }
  .careers-copy{padding:0 2px}
  .careers-copy h2{font-size:30px}
  .careers-form{padding:16px}
  .careers-field-row{grid-template-columns:1fr}
  .cv-upload{
    grid-template-columns:38px minmax(0,1fr);
  }
  .cv-file-name{
    grid-column:1/-1;
    max-width:100%;
    width:max-content;
    margin-left:49px;
  }
}


/* ===== V4.68 — rebuilt Contact -> Careers gap from zero ===== */

/*
  One exact 12px spacer, on the same continuous page background.
  No separate section background = no horizontal color seam.
*/
#contact.section{
  padding-bottom:0!important;
  margin-bottom:0!important;
  background:transparent!important;
}

.careers-section{
  padding-top:0!important;
  margin-top:12px!important;
  padding-bottom:46px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

/*
  Full-size recruitment card, as previously approved.
  IMPORTANT: there is deliberately NO top border and NO normal box-shadow.
  Therefore it cannot create a second dark horizontal band in the gap.
*/
.careers-card{
  position:relative!important;
  isolation:isolate!important;
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  margin:0 auto!important;

  display:grid!important;
  grid-template-columns:.8fr 1.2fr!important;
  gap:48px!important;
  align-items:center!important;

  padding:44px!important;
  border:1px solid var(--line)!important;
  border-top:0!important;
  border-radius:26px!important;
  background:#fff!important;

  box-shadow:none!important;
}

/*
  Careers still gets depth on the SIDES and BOTTOM.
  The shadow is drawn on a separate transparent layer and clipped exactly at
  the card's top edge, so not one pixel of this shadow can enter the gap above.
*/
.careers-card::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:transparent!important;
  box-shadow:0 18px 46px rgba(8,39,31,.075)!important;
  clip-path:inset(0 -70px -70px -70px)!important;
  z-index:0!important;
}

/* Never use the old top masking strip. */
.careers-card::before{
  content:none!important;
  display:none!important;
}

.careers-card > *{
  position:relative;
  z-index:1;
}

/* Keep the card size and typography already approved. */
.careers-copy{
  padding:4px 4px!important;
}
.careers-copy h2{
  font-size:38px!important;
  line-height:1.04!important;
  max-width:460px!important;
}
.careers-copy>p:not(.eyebrow){
  max-width:500px!important;
  font-size:15px!important;
  line-height:1.68!important;
}
.careers-eyebrow{
  font-size:18px!important;
  line-height:1.2!important;
  letter-spacing:.075em!important;
  font-weight:950!important;
  color:var(--green-700)!important;
  margin-bottom:14px!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.careers-note{
  margin-top:20px!important;
  font-size:13px!important;
}

.careers-form{
  padding:24px!important;
  border-radius:20px!important;
}
.careers-form label:not(.cv-upload):not(.careers-check){
  gap:7px!important;
  margin-bottom:14px!important;
}
.careers-form label:not(.cv-upload):not(.careers-check)>span{
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  color:#223c32!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.careers-form input[type="text"],
.careers-form input[type="tel"],
.careers-form input[type="email"]{
  height:48px!important;
  padding:0 14px!important;
  border-radius:12px!important;
}
.cv-upload{
  min-height:70px!important;
  padding:11px 13px!important;
}
.careers-submit{
  min-height:48px!important;
}

@media(max-width:980px){
  #contact.section{
    padding-bottom:0!important;
  }
  .careers-section{
    margin-top:10px!important;
    padding-top:0!important;
    padding-bottom:38px!important;
  }
  .careers-card{
    grid-template-columns:1fr!important;
    gap:26px!important;
    padding:30px!important;
  }
  .careers-copy h2,
  .careers-copy>p:not(.eyebrow){
    max-width:none!important;
  }
  .careers-eyebrow{
    font-size:17px!important;
  }
  .careers-form label:not(.cv-upload):not(.careers-check)>span{
    font-size:13.5px!important;
  }
}

@media(max-width:640px){
  #contact.section{
    padding-bottom:0!important;
  }
  .careers-section{
    margin-top:8px!important;
    padding-top:0!important;
    padding-bottom:30px!important;
  }
  .careers-card{
    padding:24px!important;
    gap:22px!important;
    border-radius:22px!important;
  }
  .careers-copy h2{
    font-size:32px!important;
  }
  .careers-copy>p:not(.eyebrow){
    font-size:14px!important;
  }
  .careers-form{
    padding:18px!important;
  }
  .careers-eyebrow{
    font-size:16px!important;
  }
  .careers-form label:not(.cv-upload):not(.careers-check)>span{
    font-size:13px!important;
  }
}


/* ===== V4.70 — mobile spacing + smooth hamburger menu ===== */

@media (max-width:640px){

  /* A little real breathing room for the green B2B card on phones only. */
  .b2b-section{
    padding-top:44px!important;
  }

  /* Keep the floating WhatsApp pill fully inside the viewport on mobile. */
  .floating-whatsapp{
    right:16px!important;
    max-width:calc(100vw - 32px)!important;
  }

  .floating-whatsapp.is-expanded{
    width:min(var(--wa-expanded-width),calc(100vw - 32px))!important;
    max-width:calc(100vw - 32px)!important;
  }

  .floating-whatsapp .wa-float-label{
    left:53px!important;
    right:12px!important;
    font-size:13px!important;
  }
}

/* Mobile/tablet hamburger dropdown:
   keep it mounted so open AND close can animate instead of appearing instantly. */
@media (max-width:980px){
  .main-nav{
    display:flex!important;
    position:absolute!important;

    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;

    transform:translateY(-14px) scale(.985)!important;
    transform-origin:top center!important;

    box-shadow:0 18px 42px rgba(8,39,31,.13)!important;

    transition:
      opacity .24s ease,
      transform .34s cubic-bezier(.16,1,.3,1),
      visibility 0s linear .34s,
      box-shadow .34s ease!important;

    will-change:transform,opacity;
  }

  .main-nav.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;

    transform:translateY(0) scale(1)!important;

    transition:
      opacity .24s ease,
      transform .34s cubic-bezier(.16,1,.3,1),
      visibility 0s linear 0s,
      box-shadow .34s ease!important;
  }

  /* Smooth hamburger -> X feedback. */
  .menu-toggle span{
    transform-origin:center!important;
    transition:
      transform .30s cubic-bezier(.16,1,.3,1),
      opacity .18s ease,
      width .24s ease!important;
  }

  .menu-toggle[aria-expanded="true"] span:nth-child(1){
    transform:translateY(7px) rotate(45deg)!important;
  }
  .menu-toggle[aria-expanded="true"] span:nth-child(2){
    opacity:0!important;
    transform:scaleX(.35)!important;
  }
  .menu-toggle[aria-expanded="true"] span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg)!important;
  }
}


/* ===== V4.71 — fix mobile B2B overlap + bubble nav + clean touch states ===== */

@media (max-width:640px){

  /*
    IMPORTANT:
    An older mobile rule used:
      .b2b-section + #proces { margin-top:-8px }
    That physically pulled Process over the B2B section and visually cut the
    bottom of the green card. Cancel it and create real breathing room.
  */
  .b2b-section + #proces{
    margin-top:0!important;
  }

  .b2b-section{
    padding-top:44px!important;
    padding-bottom:16px!important;
    overflow:visible!important;
  }

  #proces.section{
    padding-top:38px!important;
  }

  .b2b-card{
    border-radius:30px!important;
    overflow:hidden!important;
    clip-path:none!important;
    -webkit-clip-path:none!important;
    transform:translateZ(0);
    margin-bottom:0!important;
  }
}


/* ---------- Mobile navigation bubbles ---------- */
@media (max-width:980px){
  .main-nav{
    align-items:flex-start!important;
    gap:13px!important;
    padding:18px!important;
  }

  /* The four section links are distinct left-aligned bubbles. */
  .main-nav > a:not(.btn){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    align-self:flex-start!important;
    width:max-content!important;
    min-width:148px!important;
    max-width:100%!important;
    min-height:44px!important;
    box-sizing:border-box!important;

    padding:11px 17px!important;
    margin:0!important;

    border:1px solid rgba(18,112,78,.13)!important;
    border-radius:999px!important;
    background:linear-gradient(
      180deg,
      rgba(250,253,251,.99) 0%,
      rgba(237,247,242,.98) 100%
    )!important;

    color:#173d30!important;
    text-align:left!important;
    text-decoration:none!important;
    font-size:14px!important;
    font-weight:850!important;
    line-height:1.1!important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.95),
      0 5px 14px rgba(8,39,31,.045)!important;

    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
    -webkit-user-select:none!important;
    user-select:none!important;

    opacity:0;
    transform:translateY(-7px);
    transition:
      opacity .24s ease,
      transform .32s cubic-bezier(.16,1,.3,1),
      background .20s ease,
      border-color .20s ease,
      box-shadow .20s ease!important;
  }

  .main-nav.open > a:not(.btn){
    opacity:1;
    transform:translateY(0);
  }

  .main-nav.open > a:not(.btn):nth-of-type(1){transition-delay:.045s, .045s, 0s, 0s, 0s!important}
  .main-nav.open > a:not(.btn):nth-of-type(2){transition-delay:.075s, .075s, 0s, 0s, 0s!important}
  .main-nav.open > a:not(.btn):nth-of-type(3){transition-delay:.105s, .105s, 0s, 0s, 0s!important}
  .main-nav.open > a:not(.btn):nth-of-type(4){transition-delay:.135s, .135s, 0s, 0s, 0s!important}

  .main-nav > a:not(.btn):active{
    transform:scale(.985)!important;
    background:#e9f5ef!important;
    border-color:rgba(18,112,78,.23)!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.8),
      0 3px 9px rgba(8,39,31,.035)!important;
  }

  /* Keep the main CTA visually separate and full-width. */
  .main-nav > .btn{
    align-self:stretch!important;
    width:100%!important;
    margin-top:5px!important;
    text-align:center!important;
  }


  /* ---------- Hamburger / X: no blue Android tap selection ---------- */
  .menu-toggle,
  .menu-toggle *,
  .main-nav,
  .main-nav *{
    -webkit-tap-highlight-color:transparent!important;
  }

  .menu-toggle{
    -webkit-appearance:none!important;
    appearance:none!important;
    -webkit-touch-callout:none!important;
    -webkit-user-select:none!important;
    user-select:none!important;
    outline:none!important;
    border-radius:13px!important;
    background:transparent!important;
    transition:background .20s ease, transform .20s ease!important;
  }

  .menu-toggle::selection,
  .menu-toggle *::selection,
  .main-nav a::selection{
    background:transparent!important;
    color:inherit!important;
  }

  .menu-toggle:active{
    background:rgba(18,112,78,.065)!important;
    transform:scale(.96)!important;
  }

  /* Keyboard users still get a deliberate, branded focus ring. */
  .menu-toggle:focus-visible{
    outline:2px solid rgba(22,132,94,.28)!important;
    outline-offset:3px!important;
  }

  .main-nav > a:not(.btn):focus{
    outline:none!important;
  }

  .main-nav > a:not(.btn):focus-visible{
    outline:2px solid rgba(22,132,94,.24)!important;
    outline-offset:2px!important;
  }
}


/* ===== V4.72 — mobile menu symmetry, dropdown gap, smoother touch states ===== */

/* General button / tap polish */
.btn,
.btn *,
.menu-toggle,
.menu-toggle *,
.cv-upload,
.cv-upload *{
  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.btn,
.menu-toggle,
.cv-upload{
  touch-action: manipulation;
}

.btn::selection,
.btn *::selection,
.menu-toggle::selection,
.menu-toggle *::selection,
.cv-upload::selection,
.cv-upload *::selection{
  background: transparent !important;
  color: inherit !important;
}

.btn{
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    background .22s ease,
    box-shadow .22s ease,
    border-color .22s ease,
    filter .22s ease !important;
}

.btn:active{
  transform: scale(.986) !important;
}

.btn:focus{
  outline: none !important;
}

.btn:focus-visible{
  outline: 2px solid rgba(22,132,94,.22) !important;
  outline-offset: 3px !important;
}

/* CV upload area/button feels consistent and avoids ugly blue selection tint */
.cv-upload{
  transition:
    transform .24s cubic-bezier(.2,.8,.2,1),
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}
.cv-upload:active{
  transform: scale(.992) !important;
}

/* Mobile menu refinements */
@media (max-width:980px){
  .main-nav{
    top: calc(100% + 10px) !important;   /* small air gap below header */
    border-radius: 22px !important;
  }

  .main-nav > a:not(.btn){
    width: 100% !important;              /* all bubbles same full width */
    min-width: 0 !important;
    max-width: none !important;
    justify-content: flex-start !important;
    padding: 12px 20px !important;
  }

  .main-nav > .btn{
    width: 100% !important;
    margin-top: 6px !important;
  }
}

@media (max-width:640px){
  /* slightly more visual separation between header and opened mobile menu */
  .main-nav{
    top: calc(100% + 12px) !important;
    left: 14px !important;
    right: 14px !important;
  }

  /* real breathing room under the green B2B card on mobile */
  .b2b-section{
    padding-top: 44px !important;
    padding-bottom: 22px !important;
  }

  .b2b-card{
    margin-bottom: 12px !important;
    border-radius: 30px !important;
    overflow: hidden !important;
  }

  .b2b-section + #proces{
    margin-top: 0 !important;
  }

  #proces.section{
    padding-top: 34px !important;
  }
}


/* ===== V4.73 — clickable logo polish + lighter glass header ===== */

/* More visible glass effect without becoming truly transparent. */
.site-header{
  background:rgba(247,250,248,.72)!important;
  -webkit-backdrop-filter:blur(20px) saturate(125%)!important;
  backdrop-filter:blur(20px) saturate(125%)!important;
  border-bottom:1px solid rgba(214,227,220,.58)!important;
  box-shadow:0 5px 18px rgba(8,39,31,.025)!important;
}

/* Logo behaves like a polished home button. */
.brand{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  border-radius:14px!important;

  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;

  outline:none!important;
  touch-action:manipulation;

  transition:
    transform .30s cubic-bezier(.2,.8,.2,1),
    filter .26s ease,
    opacity .26s ease!important;
}

.brand,
.brand img{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}

.brand::selection,
.brand img::selection{
  background:transparent!important;
}

.brand:hover{
  transform:translateY(-1px)!important;
  filter:drop-shadow(0 5px 10px rgba(8,75,54,.08))!important;
}

.brand:active{
  transform:scale(.965)!important;
  filter:drop-shadow(0 2px 5px rgba(8,75,54,.06))!important;
}

.brand:focus{
  outline:none!important;
}

.brand:focus-visible{
  outline:2px solid rgba(22,132,94,.22)!important;
  outline-offset:4px!important;
}

@media(max-width:640px){
  .site-header{
    background:rgba(247,250,248,.70)!important;
    -webkit-backdrop-filter:blur(20px) saturate(128%)!important;
    backdrop-filter:blur(20px) saturate(128%)!important;
  }
}


/* ===== V4.74 — custom green consent checkboxes + visible mobile textarea grip ===== */

/* Consent checkboxes: Clean4U green, slightly rounded, no native blue state. */
.check input[type="checkbox"],
.careers-check input[type="checkbox"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  flex:0 0 18px!important;
  margin-top:2px!important;

  border:1.5px solid rgba(20,83,63,.46)!important;
  border-radius:5px!important;
  background:#fff!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:12px 12px!important;

  cursor:pointer!important;
  outline:none!important;
  box-shadow:inset 0 1px 2px rgba(8,39,31,.035)!important;

  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation;

  transition:
    background-color .20s ease,
    border-color .20s ease,
    box-shadow .22s ease,
    transform .18s cubic-bezier(.2,.8,.2,1)!important;
}

.check input[type="checkbox"]:checked,
.careers-check input[type="checkbox"]:checked{
  background-color:var(--green-700)!important;
  border-color:var(--green-700)!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3 6.4 11.2 12.8 4.8' fill='none' stroke='white' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  box-shadow:
    0 0 0 3px rgba(22,132,94,.10),
    inset 0 1px 0 rgba(255,255,255,.14)!important;
}

.check input[type="checkbox"]:active,
.careers-check input[type="checkbox"]:active{
  transform:scale(.91)!important;
}

.check input[type="checkbox"]:focus-visible,
.careers-check input[type="checkbox"]:focus-visible{
  box-shadow:
    0 0 0 3px rgba(22,132,94,.14),
    inset 0 1px 2px rgba(8,39,31,.03)!important;
}

/* Recruitment consent has room: make it easier to read. */
.careers-check{
  font-size:12px!important;
  line-height:1.5!important;
  gap:10px!important;
  align-items:flex-start!important;
}
.careers-check > span{
  font-size:12px!important;
  line-height:1.5!important;
  color:#66766f!important;
}

/* Main details textarea: custom resize affordance, visible on desktop + mobile. */
.message-resize-label{
  position:relative!important;
}

.message-resize-label textarea[name="message"]{
  min-height:126px!important;
  padding-right:34px!important;
  padding-bottom:30px!important;
  resize:vertical!important;
}

.textarea-resize-grip{
  position:absolute!important;
  right:11px!important;
  bottom:27px!important;
  width:22px!important;
  height:22px!important;
  z-index:3!important;

  border-radius:7px!important;
  cursor:ns-resize!important;
  touch-action:none!important;

  -webkit-tap-highlight-color:transparent!important;
  -webkit-user-select:none!important;
  user-select:none!important;

  opacity:.72!important;

  background:
    linear-gradient(135deg,
      transparent 0 47%,
      rgba(18,112,78,.38) 48% 54%,
      transparent 55% 100%) 8px 8px/10px 10px no-repeat,
    linear-gradient(135deg,
      transparent 0 47%,
      rgba(18,112,78,.58) 48% 55%,
      transparent 56% 100%) 3px 3px/15px 15px no-repeat,
    rgba(236,247,241,.92)!important;

  border:1px solid rgba(18,112,78,.16)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 3px 8px rgba(8,39,31,.055)!important;

  transition:
    opacity .20s ease,
    transform .20s ease,
    background-color .20s ease,
    box-shadow .20s ease!important;
}

.textarea-resize-grip:hover{
  opacity:1!important;
  transform:scale(1.04)!important;
}

.textarea-resize-grip.is-dragging{
  opacity:1!important;
  transform:scale(.96)!important;
  box-shadow:
    0 0 0 3px rgba(22,132,94,.11),
    0 3px 9px rgba(8,39,31,.06)!important;
}

@media(max-width:640px){
  .careers-check,
  .careers-check > span{
    font-size:12.5px!important;
    line-height:1.5!important;
  }

  .message-resize-label textarea[name="message"]{
    min-height:132px!important;
    padding-right:38px!important;
    padding-bottom:34px!important;
  }

  .textarea-resize-grip{
    width:26px!important;
    height:26px!important;
    right:9px!important;
    bottom:25px!important;
    opacity:.92!important;
    border-radius:8px!important;
  }
}


/* ===== V4.75 — align mobile textarea grip + unify recruitment checkbox ===== */

/* Keep both consent checkboxes visually identical */
.check input[type="checkbox"],
.careers-check input[type="checkbox"]{
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  flex:0 0 20px!important;
  margin-top:1px!important;
  border-radius:6px!important;
  background-size:13px 13px!important;
}

/* remove ugly blue tap/text selection specifically on recruitment consent */
.careers-check,
.careers-check span,
.careers-check input,
.check,
.check span,
.check input{
  -webkit-tap-highlight-color: transparent !important;
}

.careers-check,
.careers-check > span,
.check,
.check > span{
  -webkit-user-select:none!important;
  user-select:none!important;
}

.careers-check::selection,
.careers-check > span::selection,
.check::selection,
.check > span::selection{
  background:transparent!important;
  color:inherit!important;
}

/* better vertical rhythm after slightly larger checkbox */
.careers-check{
  gap:12px!important;
  align-items:flex-start!important;
}
.check{
  gap:12px!important;
  align-items:flex-start!important;
}

/* move the resize grip lower so bottom/right spacing feels equal */
.textarea-resize-grip{
  right:12px!important;
  bottom:12px!important;
}

@media(max-width:640px){
  .check input[type="checkbox"],
  .careers-check input[type="checkbox"]{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    flex:0 0 22px!important;
    margin-top:1px!important;
    border-radius:6px!important;
    background-size:14px 14px!important;
  }

  .textarea-resize-grip{
    width:26px!important;
    height:26px!important;
    right:10px!important;
    bottom:10px!important;
    border-radius:8px!important;
  }
}


/* ===== V4.76 — make both consent checkboxes truly identical ===== */

.check input[type="checkbox"],
.careers-check input[type="checkbox"]{
  box-sizing:border-box!important;
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  min-height:28px!important;
  flex:0 0 28px!important;

  padding:0!important;
  margin:0!important;

  border:1.5px solid rgba(20,83,63,.46)!important;
  border-radius:7px!important;
  background-size:16px 16px!important;

  -webkit-tap-highlight-color:transparent!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}

/* keep both labels aligned from the top with the larger identical boxes */
.check,
.careers-check{
  align-items:flex-start!important;
  gap:12px!important;
}

/* absolutely no blue selection/tap flash on recruitment consent */
.careers-check,
.careers-check *,
.careers-check input[type="checkbox"]{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
}

.careers-check::selection,
.careers-check *::selection{
  background:transparent!important;
  color:inherit!important;
}


/* ===== V4.77 — tighter dial prefix trigger + clean floating WhatsApp taps ===== */

/* Dial-code trigger:
   arrow now follows the rendered prefix instead of sitting after a flexible 1fr column.
   max-content safely accommodates +40, +420, +998 and even longer codes such as +1809. */
.dial-picker{
  flex:0 0 118px!important;
}

.dial-trigger{
  grid-template-columns:24px max-content 14px!important;
  justify-content:start!important;
  column-gap:4px!important;
  padding-left:8px!important;
  padding-right:8px!important;
}

.dial-selected-flag{
  width:24px!important;
  min-width:24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.dial-selected-code{
  width:max-content!important;
  min-width:max-content!important;
  text-align:left!important;
  white-space:nowrap!important;
}

.dial-chevron{
  width:14px!important;
  height:14px!important;
  margin-left:1px!important;
}

/* Floating WhatsApp — no Android/Chrome blue tap highlight in either state. */
.floating-whatsapp,
.floating-whatsapp *,
.floating-whatsapp.is-expanded,
.floating-whatsapp.is-expanded *{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;
}

.floating-whatsapp{
  outline:none!important;
  touch-action:manipulation!important;
}

.floating-whatsapp::selection,
.floating-whatsapp *::selection{
  background:transparent!important;
  color:inherit!important;
}

.floating-whatsapp:focus{
  outline:none!important;
}

.floating-whatsapp:focus-visible{
  outline:2px solid rgba(37,211,102,.24)!important;
  outline-offset:3px!important;
}

/* Keep tap feedback branded/smooth rather than browser-native. */
.floating-whatsapp:active{
  transform:scale(.965)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.16)!important;
}

.floating-whatsapp.is-expanded:active{
  transform:scale(.985)!important;
}

@media(max-width:520px){
  .dial-picker{
    flex-basis:114px!important;
    width:114px!important;
  }

  .dial-trigger{
    grid-template-columns:23px max-content 13px!important;
    column-gap:3px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }

  .dial-selected-flag{
    width:23px!important;
    min-width:23px!important;
  }

  .dial-chevron{
    width:13px!important;
    height:13px!important;
    margin-left:1px!important;
  }
}


/* ===== V4.78 — truly symmetric auto-sized dial prefix selector ===== */

/*
  No fixed width anymore.
  The selector now grows/shrinks with the actual prefix:
  flag + code + arrow + equal left/right padding.
  This keeps +40 compact while +420 / +998 expand safely.
*/
.dial-picker{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
}

.dial-trigger{
  width:max-content!important;
  min-width:0!important;
  box-sizing:border-box!important;

  grid-template-columns:24px max-content 14px!important;
  justify-content:start!important;
  align-items:center!important;

  column-gap:4px!important;

  /* move the whole content a few px right, then mirror that spacing on right */
  padding-left:11px!important;
  padding-right:11px!important;
}

.dial-selected-flag{
  width:24px!important;
  min-width:24px!important;
  max-width:24px!important;
}

.dial-selected-code{
  width:max-content!important;
  min-width:max-content!important;
  white-space:nowrap!important;
}

.dial-chevron{
  width:14px!important;
  min-width:14px!important;
  height:14px!important;
  margin-left:1px!important;
}

/* Same geometry on phones — still auto-sized, never fixed-width. */
@media(max-width:520px){
  .dial-picker{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
  }

  .dial-trigger{
    width:max-content!important;
    min-width:0!important;
    grid-template-columns:23px max-content 13px!important;
    column-gap:4px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }

  .dial-selected-flag{
    width:23px!important;
    min-width:23px!important;
    max-width:23px!important;
  }

  .dial-chevron{
    width:13px!important;
    min-width:13px!important;
    height:13px!important;
    margin-left:1px!important;
  }
}


/* ===== V4.79 — crisp vector flags, no ugly outline ===== */

/* Visible language + phone flags are now SVG files.
   Remove the old 1px faux border/shadow and render cleanly. */
.lang-flag-img,
.dial-flag-img{
  display:block!important;
  width:24px!important;
  height:18px!important;
  max-width:24px!important;
  max-height:18px!important;

  object-fit:contain!important;
  object-position:center!important;

  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;

  border-radius:1.5px!important;

  image-rendering:auto!important;
  transform:translateZ(0);
  backface-visibility:hidden;
}

/* Containers must not add their own outline around the artwork. */
.lang-trigger-flag,
.lang-option-flag,
.dial-selected-flag,
.dial-option-flag{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  overflow:visible!important;
}

/* Remove the legacy faux frame from old inline flags as well. */
.flag-svg{
  box-shadow:none!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
}

/* Slightly larger source presentation on high-density mobile screens,
   without changing layout dimensions. */
@media(max-width:640px){
  .lang-flag-img,
  .dial-flag-img{
    width:24px!important;
    height:18px!important;
  }
}


/* ===== V4.80 — subtle 3D depth for vector flags ===== */

.lang-flag-img,
.dial-flag-img{
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.10))
    drop-shadow(0 2px 3px rgba(0,0,0,.07))!important;

  transition:
    filter .22s ease,
    transform .22s cubic-bezier(.2,.8,.2,1)!important;
}

/* Tiny lift on interactive states, still very subtle. */
.lang-trigger:hover .lang-flag-img,
.mobile-lang-trigger:hover .lang-flag-img,
.lang-option:hover .lang-flag-img,
.dial-trigger:hover .dial-flag-img,
.dial-option:hover .dial-flag-img{
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.11))
    drop-shadow(0 3px 4px rgba(0,0,0,.09))!important;
  transform:translateY(-.5px)!important;
}


/* ===== V4.81 — visible resize grip for "Alt serviciu" textarea ===== */

/* Let the revealed card actually grow when the user resizes its textarea. */
.other-service-field.is-visible{
  max-height:760px!important;
  overflow:visible!important;
}

/* Same positioning model as the main Details textarea. */
.other-service-card{
  position:relative!important;
}

.other-service-card textarea[name="other_service"]{
  min-height:78px!important;
  padding-right:38px!important;
  padding-bottom:34px!important;
  resize:vertical!important;
}

/* Reuse the exact visual grip language already approved. */
.other-service-resize-grip{
  right:10px!important;
  bottom:10px!important;
  width:26px!important;
  height:26px!important;
  border-radius:8px!important;
  opacity:.92!important;
}

@media(min-width:641px){
  .other-service-resize-grip{
    right:12px!important;
    bottom:12px!important;
    width:22px!important;
    height:22px!important;
    border-radius:7px!important;
    opacity:.72!important;
  }

  .other-service-card textarea[name="other_service"]{
    padding-right:34px!important;
    padding-bottom:30px!important;
  }
}


/* ===== V4.82 — correctly inset "Alt serviciu" resize grip ===== */

/*
  .other-service-card has 16px horizontal and 17px bottom padding.
  The grip is absolutely positioned relative to that card, so include that
  padding in the offset to place it INSIDE the textarea rather than on the
  outer green card border.
*/
.other-service-resize-grip{
  right:26px!important;   /* 16px card padding + 10px inner textarea gap */
  bottom:27px!important;  /* 17px card padding + 10px inner textarea gap */
}

@media(min-width:641px){
  .other-service-resize-grip{
    right:28px!important;  /* 16px + 12px */
    bottom:29px!important; /* 17px + 12px */
  }
}


/* ===== V4.83 — viewport-safe dial menu + cleaner services + interactive process/header ===== */

/* Phone-prefix dropdown stays inside the visible page on medium/desktop viewports.
   JS writes only the horizontal correction required for the current device width. */
.dial-menu{
  left:var(--dial-menu-left, 0px)!important;
  max-width:calc(100vw - 32px)!important;
}

/* Mobile keeps the existing bottom-sheet geometry untouched. */
@media(max-width:520px){
  .dial-menu{
    left:14px!important;
    right:14px!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* First process step is now a real link, but visually remains the same card. */
.process-step-link{
  display:block;
  color:inherit;
  text-decoration:none;
  cursor:pointer;

  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;

  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s ease,
    border-color .28s ease,
    background-color .28s ease!important;
}

.process-step-link:hover{
  transform:translateY(-3px);
  border-top-color:rgba(20,131,91,.58)!important;
  background:rgba(247,252,249,.86)!important;
  box-shadow:0 12px 28px rgba(8,39,31,.065);
}

.process-step-link:active{
  transform:translateY(-1px) scale(.988);
  box-shadow:0 5px 14px rgba(8,39,31,.05);
}

.process-step-link:focus-visible{
  outline:3px solid rgba(36,185,120,.20);
  outline-offset:4px;
}

.process-step-link::selection,
.process-step-link *::selection{
  background:transparent;
  color:inherit;
}

#contact{
  scroll-margin-top:105px;
}

/* Desktop header links:
   no bubble shape — only smooth green color, a small lift and a fine animated accent line. */
@media(min-width:981px){
  .main-nav > a:not(.btn){
    position:relative;
    display:inline-flex;
    align-items:center;
    padding:9px 1px!important;

    color:var(--ink);
    -webkit-tap-highlight-color:transparent;

    transition:
      color .26s ease,
      transform .28s cubic-bezier(.2,.8,.2,1),
      text-shadow .26s ease!important;
  }

  .main-nav > a:not(.btn)::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:4px;
    width:78%;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--green-700),#31b77e);
    opacity:0;
    transform:translateX(-50%) scaleX(.18);
    transform-origin:center;
    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      opacity .22s ease;
    pointer-events:none;
  }

  .main-nav > a:not(.btn):hover{
    color:var(--green-700)!important;
    transform:translateY(-2px);
    text-shadow:0 5px 15px rgba(19,118,82,.09);
  }

  .main-nav > a:not(.btn):hover::after{
    opacity:.78;
    transform:translateX(-50%) scaleX(1);
  }

  .main-nav > a:not(.btn):active{
    transform:translateY(0) scale(.965);
    color:var(--green-800)!important;
    text-shadow:none;
    transition-duration:.12s!important;
  }

  .main-nav > a:not(.btn):active::after{
    opacity:1;
    transform:translateX(-50%) scaleX(.82);
  }

  .main-nav > a:not(.btn):focus-visible{
    outline:2px solid rgba(22,132,94,.22);
    outline-offset:5px;
    border-radius:5px;
  }
}


/* ===== V4.84 — real viewport gutter for dial menu + stable desktop nav hover ===== */

/* Desktop / laptop prefix menu:
   position against the VIEWPORT, not the phone field, so a real safety gutter
   is guaranteed even on narrow laptop screens. */
@media(min-width:521px){
  .dial-menu{
    position:fixed!important;
    left:var(--dial-menu-vx, 28px)!important;
    top:var(--dial-menu-vy, 90px)!important;
    right:auto!important;

    width:min(420px, calc(100vw - 56px))!important;
    max-width:calc(100vw - 56px)!important;

    /* enough room for the native/custom scrollbar to remain visually clear */
    margin:0!important;
    transform-origin:top left!important;
  }
}

/* Phones keep the existing bottom sheet exactly as before. */
@media(max-width:520px){
  .dial-menu{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    top:auto!important;
    bottom:16px!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* Stable desktop header interaction.
   Keep a compositor layer active before/during/after hover to avoid the
   post-transition text-rendering "snap" some browsers show. */
@media(min-width:981px){
  .main-nav > a:not(.btn){
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;

    transform:translate3d(0,0,0)!important;
    backface-visibility:hidden!important;
    -webkit-backface-visibility:hidden!important;
    will-change:transform,color!important;

    text-shadow:none!important;
    -webkit-font-smoothing:antialiased;

    transition:
      color .24s ease,
      transform .28s cubic-bezier(.2,.8,.2,1)!important;
  }

  .main-nav > a:not(.btn)::after{
    will-change:transform,opacity!important;
    backface-visibility:hidden!important;
    -webkit-backface-visibility:hidden!important;

    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      opacity .22s ease!important;
  }

  .main-nav > a:not(.btn):hover{
    color:var(--green-700)!important;
    transform:translate3d(0,-2px,0)!important;
    text-shadow:none!important;
  }

  .main-nav > a:not(.btn):hover::after{
    opacity:.78!important;
    transform:translateX(-50%) scaleX(1)!important;
  }

  .main-nav > a:not(.btn):active{
    color:var(--green-800)!important;
    transform:translate3d(0,0,0) scale(.97)!important;
    text-shadow:none!important;
    transition-duration:.12s!important;
  }

  .main-nav > a:not(.btn):active::after{
    opacity:1!important;
    transform:translateX(-50%) scaleX(.82)!important;
  }
}


/* ===== V4.85 — identical reusable dial picker in recruitment form ===== */

/* Recruitment phone occupies the second grid cell exactly like the old field. */
.careers-phone-field{
  display:grid;
  gap:7px;
  margin-bottom:14px;
  min-width:0;
  align-content:start;
}

.careers-phone-label{
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  color:#223c32!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

/* Match the 48px recruitment inputs while retaining the exact prefix component. */
.careers-phone-input-group{
  height:48px;
  min-height:48px;
  border-radius:12px!important;
}

.careers-phone-input-group .dial-picker{
  height:100%;
}

.careers-phone-input-group .dial-trigger{
  min-height:48px!important;
  height:48px!important;
  border-radius:11px 0 0 11px!important;
}

.careers-phone-input-group input[type="tel"]{
  height:48px!important;
  min-height:48px!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:0 12px 12px 0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.careers-phone-input-group input[type="tel"]:focus{
  border:0!important;
  box-shadow:none!important;
}

/* The group itself owns the focus ring, identical to the main form. */
.careers-phone-input-group:focus-within{
  border-color:var(--green-600)!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.11)!important;
  background:#fff!important;
}

/* Ensure neither picker gets Android/Chrome blue flashes. */
.dial-picker,
.dial-picker *,
.dial-trigger,
.dial-menu,
.dial-option,
.dial-custom-toggle,
.dial-custom-apply{
  -webkit-tap-highlight-color:transparent!important;
}

/* Keep both menus independently positioned by their own CSS variables. */
@media(min-width:521px){
  .dial-picker .dial-menu{
    left:var(--dial-menu-vx, 28px)!important;
    top:var(--dial-menu-vy, 90px)!important;
  }
}

@media(max-width:640px){
  .careers-phone-field{
    margin-bottom:14px;
  }
}


/* ===== V4.87 — live bidirectional WhatsApp pill sizing ===== */
.floating-whatsapp{
  transition:
    width .62s cubic-bezier(.22,.8,.24,1),
    transform .28s ease,
    box-shadow .28s ease!important;
}

/* Keep label movement/opacity independent from width resizing. */
.floating-whatsapp .wa-float-label{
  transition:
    opacity .42s ease .18s,
    transform .52s cubic-bezier(.22,.8,.24,1) .10s!important;
}

@media(prefers-reduced-motion:reduce){
  .floating-whatsapp,
  .floating-whatsapp .wa-float-label{
    transition:none!important;
  }
}


/* ===== V4.88 — hard synchronization for PRO + all shiny CTA buttons ===== */
/*
  Language switching rebuilds the hero title, which naturally creates a new
  .hero-pro animation while the existing buttons keep their old phase.
  This one-frame reset class lets JS restart every related shine together.
*/
html.clean4u-shine-sync-reset .hero-pro,
html.clean4u-shine-sync-reset .btn-hero-shine,
html.clean4u-shine-sync-reset .btn-hero-shine::after,
html.clean4u-shine-sync-reset .btn-whatsapp-main,
html.clean4u-shine-sync-reset .btn-whatsapp-main::after,
html.clean4u-shine-sync-reset .contact-action-btn.whatsapp,
html.clean4u-shine-sync-reset .contact-action-btn.whatsapp::after{
  animation:none!important;
}


/* ===== V4.93 — inline form/contact actions + elegant form attention ===== */

.form-copy .form-copy-action{
  color:#13704f!important;
  font:inherit!important;
  font-weight:inherit!important;
  letter-spacing:inherit!important;
  line-height:inherit!important;
  text-decoration:none!important;
  cursor:pointer!important;
  border-radius:3px;
  -webkit-tap-highlight-color:transparent!important;
  transition:
    color .20s ease,
    background-color .22s ease,
    box-shadow .22s ease,
    transform .20s cubic-bezier(.2,.8,.2,1)!important;
}

.form-copy .form-copy-action:hover{
  color:var(--green-900)!important;
  background:rgba(19,112,79,.065);
}

.form-copy .form-copy-action:active{
  transform:translateY(1px);
  background:rgba(19,112,79,.10);
}

.form-copy .form-copy-action:focus-visible{
  outline:2px solid rgba(19,112,79,.20);
  outline-offset:3px;
}

/* Desktop attention animation for the contact form itself. */
.form-card-wrap.is-form-highlight .visit-form{
  animation:clean4uFormAttention .92s cubic-bezier(.2,.72,.22,1) both;
}

.form-card-wrap.is-form-highlight .form-section-label{
  animation:clean4uFormLabelAttention .92s cubic-bezier(.2,.72,.22,1) both;
}

@keyframes clean4uFormAttention{
  0%{
    transform:translateY(0);
    box-shadow:0 18px 50px rgba(8,39,31,.06);
    border-color:var(--line);
  }
  38%{
    transform:translateY(-2px);
    box-shadow:
      0 20px 54px rgba(8,39,31,.075),
      0 0 0 4px rgba(19,112,79,.10);
    border-color:rgba(19,112,79,.30);
  }
  100%{
    transform:translateY(0);
    box-shadow:0 18px 50px rgba(8,39,31,.06);
    border-color:var(--line);
  }
}

@keyframes clean4uFormLabelAttention{
  0%,100%{ transform:translateY(0); }
  38%{ transform:translateY(-2px); }
}

@media(max-width:980px){
  #visit-form{
    scroll-margin-top:96px;
  }
}

@media(prefers-reduced-motion:reduce){
  .form-card-wrap.is-form-highlight .visit-form,
  .form-card-wrap.is-form-highlight .form-section-label{
    animation:none!important;
  }
}


/* ===== V4.95 — align the actual email bubbles with "Formular de contact" ===== */
@media(max-width:640px){
  /*
    Move the whole email cards 8px left, not just their text.
    Increasing width by the same 8px keeps their right edge exactly where it was.
  */
  .contact-email-block .contact-inline-link{
    margin-left:-8px!important;
    margin-right:0!important;
    width:calc(100% + 8px)!important;
    max-width:none!important;
  }
}


/* ===== V4.97 — align email TEXT with "Formular de contact", bubbles untouched ===== */

/*
  The "Formular de contact" pill uses 15px horizontal inner padding.
  Give the two email cards the same left inset so all three text starts
  sit on the same vertical line. Card position/width is left untouched.
*/
.contact-email-block .contact-inline-link{
  padding-left:15px!important;
}


/* ===== V4.98 — native DOM language morph; no snapshots, no flash ===== */

/*
  Language changes now animate the REAL DOM only.
  No View Transition snapshots are used, so there is no old/new image overlap,
  ghosting or pop when controls change size.
*/
html.clean4u-language-changing{
  --c4u-lang-ease:cubic-bezier(.22,.68,.26,1);
}

/*
  Compact controls that change intrinsic width receive a temporary inline
  width/height transition from JS. Keep typography rendering steady.
*/
html.clean4u-language-changing [data-i18n]{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  -webkit-font-smoothing:antialiased;
}

/* Rapid language tapping should never create blue/native tap flashes. */
.lang-switch,
.lang-switch *,
.mobile-lang-dropdown,
.mobile-lang-dropdown *{
  -webkit-tap-highlight-color:transparent!important;
}

@media(prefers-reduced-motion:reduce){
  html.clean4u-language-changing [data-i18n]{
    transition:none!important;
  }
}


/* ===== V4.99 — truly smooth live WhatsApp width while language changes ===== */

/*
  Register the calculated pill width as a typed length so Chrome/Samsung
  can interpolate the VALUE itself instead of jumping between two var() values.
*/
@property --wa-expanded-width{
  syntax:"<length>";
  inherits:false;
  initial-value:285px;
}

.floating-whatsapp{
  transition:
    --wa-expanded-width .58s cubic-bezier(.22,.72,.24,1),
    width .58s cubic-bezier(.22,.72,.24,1),
    transform .28s ease,
    box-shadow .28s ease!important;
}

/*
  The label still changes independently; the bubble now follows its new
  intrinsic text width continuously in both directions.
*/
.floating-whatsapp.is-expanded{
  will-change:width;
}


/* ===== V5.1 — final language-morph polish + fixed WhatsApp label centering ===== */

/*
  Keep the floating WhatsApp text vertically centered using flex alignment,
  not translateY(-50%). Language animations can no longer disturb its Y position.
*/
.floating-whatsapp .wa-float-label{
  top:0!important;
  bottom:0!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  transform:translateX(10px)!important;
}

.floating-whatsapp.is-expanded .wa-float-label{
  transform:translateX(0)!important;
}

/*
  During a compact control width morph, keep its translated copy on one line.
  JS applies this class only when that control truly changes width.
*/
.clean4u-lang-nowrap{
  white-space:nowrap!important;
}
.clean4u-lang-nowrap [data-i18n]{
  white-space:nowrap!important;
}


/* ===== V5.2 — smooth 2D/diagonal layout motion during language changes ===== */

/*
  Layout-sensitive elements use CSS individual transform properties through
  Web Animations (translate/scale), leaving each button's normal transform
  hover/active behavior untouched.
*/
html.clean4u-language-changing .clean4u-lang-moving{
  will-change:translate,scale;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}


/* ===== V5.3 — protected company name + smooth coverage height morph ===== */

.company-name{
  font:inherit!important;
  color:inherit!important;
  letter-spacing:inherit!important;
  text-transform:inherit!important;
}

/*
  Coverage card participates in the existing real-DOM height morph.
  Its left green decorative border therefore grows/shrinks with the card
  instead of snapping when a translation adds/removes lines.
*/
.coverage-card{
  box-sizing:border-box;
  transform-origin:top left;
}


/* ===== V5.4 — calmer coverage movement + slow mini-logo glide ===== */

.about-mini-logo{
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  transform:translateY(1px) translateZ(0);
}

html.clean4u-language-changing .about-mini-logo{
  will-change:translate;
}

html.clean4u-language-changing .coverage-card{
  will-change:height,translate;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}


/* ===== V5.5 — smooth process-card grow/shrink on language changes ===== */

html.clean4u-language-changing .process-step{
  will-change:height,translate;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/*
  Keep each process card's box model stable while its translated copy needs
  more or less vertical room. Text wrapping remains natural in HU/UA.
*/
.process-step{
  box-sizing:border-box;
}


/* ===== V5.6 — smooth contact-form copy + translated ghost text ===== */

/* Native placeholder copy that changes with language. */
#surface-input::placeholder,
.dial-search-input::placeholder{
  opacity:1;
  transition:
    opacity .22s cubic-bezier(.22,.68,.26,1),
    color .22s ease!important;
}

#surface-input.clean4u-placeholder-hidden::placeholder,
.dial-search-input.clean4u-placeholder-hidden::placeholder{
  opacity:0!important;
}

/*
  The two custom "Selectează / Select / ..." values are real spans and are
  now part of the language text engine. Keep their rasterization stable.
*/
.form-select-value{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  -webkit-font-smoothing:antialiased;
}

/* Left contact-form copy and the form below it glide when wrapping changes. */
html.clean4u-language-changing .form-copy > h2,
html.clean4u-language-changing .form-copy > p:not(.eyebrow),
html.clean4u-language-changing .contact-mini,
html.clean4u-language-changing .form-card-wrap{
  will-change:translate;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}


/* ===== V5.7 — smooth stacked Form / Contact / Careers cards ===== */

.visit-form,
.contact-panel,
.careers-card,
.careers-form{
  box-sizing:border-box;
  transform-origin:top center;
}

html.clean4u-language-changing .visit-form,
html.clean4u-language-changing .contact-panel,
html.clean4u-language-changing .careers-card,
html.clean4u-language-changing .careers-form{
  will-change:height;
}

/*
  While text translations change line count, these panels keep their old
  physical height first and then morph to the new height. Because the height
  itself participates in normal layout, neighbouring sections are pushed
  smoothly and cannot visually collapse through one another.
*/
html.clean4u-language-changing .visit-form,
html.clean4u-language-changing .contact-panel,
html.clean4u-language-changing .careers-card{
  isolation:isolate;
}

/*
  The green recruitment indicator fades with its translated sentence.
  Also anchor it to the first line instead of vertically re-centering it when
  HU/UA wrap onto extra lines.
*/
.careers-note{
  align-items:flex-start!important;
}
.careers-note-dot{
  margin-top:4px!important;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}


/* ===== V5.9 — normalize first contact-form row geometry ===== */

/*
  The phone caption is a <label> nested inside .phone-field and was also
  receiving the generic .visit-form label margin-bottom/grid rules.
  That made the first grid row taller and stretched the Name input.
*/
.visit-form .phone-field > label{
  display:block!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  align-self:auto!important;
}

/* Prevent either column from stretching its field vertically to match the row. */
.visit-form .field-row > label,
.visit-form .field-row > .phone-field,
.visit-form .field-row > .form-custom-select{
  align-self:start!important;
}

/* Keep ordinary single-line fields at one consistent visual height. */
.visit-form input[type="text"],
.visit-form input[type="email"]{
  min-height:0!important;
}


/* ===== V5.10 — equal phone-field heights + complete careers phone frame ===== */

/* Main contact form: match the visual height of ordinary single-line inputs. */
.visit-form .phone-input-group{
  height:47px!important;
  min-height:47px!important;
  box-sizing:border-box!important;
}

.visit-form .phone-input-group .dial-picker{
  height:100%!important;
  align-self:stretch!important;
}

.visit-form .phone-input-group .dial-trigger{
  height:100%!important;
  min-height:0!important;
  box-sizing:border-box!important;
}

.visit-form .phone-input-group input[type="tel"]{
  height:100%!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding-top:0!important;
  padding-bottom:0!important;
}

/* Recruitment phone: the OUTER group owns the complete rounded frame. */
.careers-phone-input-group{
  position:relative!important;
  height:48px!important;
  min-height:48px!important;
  box-sizing:border-box!important;
  border:1px solid #cedbd4!important;
  border-radius:12px!important;
  background:#fbfdfc!important;

  /* Extra inset line guarantees a continuous frame around the prefix side
     without clipping the fixed-position dial menu. */
  box-shadow:inset 0 0 0 .01px #cedbd4!important;
}

.careers-phone-input-group .dial-picker{
  height:100%!important;
  align-self:stretch!important;
  position:relative!important;
  z-index:1!important;
}

.careers-phone-input-group .dial-trigger{
  height:100%!important;
  min-height:0!important;
  box-sizing:border-box!important;

  /* Keep only the internal separator; outer outline belongs to the parent. */
  border-top:0!important;
  border-bottom:0!important;
  border-left:0!important;
  border-right:1px solid #d8e2dd!important;
  border-radius:11px 0 0 11px!important;

  /* Pull the coloured prefix surface one pixel away from the outer frame,
     so the parent border remains fully visible on left/top/bottom. */
  margin:1px 0 1px 1px!important;
  height:calc(100% - 2px)!important;
}

.careers-phone-input-group input[type="tel"]{
  height:100%!important;
  min-height:0!important;
  box-sizing:border-box!important;
  border:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
}

/* Preserve the complete outer frame on focus too. */
.careers-phone-input-group:focus-within{
  border-color:var(--green-600)!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.11)!important;
}


/* ===== V5.11 — center recruitment consent text with checkbox ===== */

.careers-check{
  align-items:center!important;
}

.careers-check input[type="checkbox"]{
  margin:0!important;
  align-self:center!important;
}

.careers-check > span{
  display:block!important;
  margin:0!important;
}


/* ===== V5.12 — calm nested motion for Form / Contact / Careers ===== */

html.clean4u-language-changing .visit-form,
html.clean4u-language-changing .contact-panel,
html.clean4u-language-changing .careers-card,
html.clean4u-language-changing .careers-form{
  will-change:height;
  contain:paint;
}

/* Inner visual shells glide without deformation. */
html.clean4u-language-changing .visit-form .btn,
html.clean4u-language-changing .visit-form .form-select-trigger,
html.clean4u-language-changing .contact-panel .contact-link-block,
html.clean4u-language-changing .contact-panel .contact-action-btn,
html.clean4u-language-changing .contact-panel .contact-inline-link,
html.clean4u-language-changing .careers-card .cv-upload,
html.clean4u-language-changing .careers-card .careers-check,
html.clean4u-language-changing .careers-card .btn{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/*
  During language morphs, suppress ordinary hover transitions only while the
  choreography is active. They return immediately afterwards.
*/
html.clean4u-language-changing .visit-form .btn,
html.clean4u-language-changing .contact-panel a,
html.clean4u-language-changing .careers-card .btn,
html.clean4u-language-changing .careers-card .cv-upload{
  transition-property:width,height!important;
}


/* ===== V5.13 — consistent form rhythm + careers typography + contact alignment ===== */

/* ------------------------------------------------------------------
   1) Recruitment labels: exactly match the Contact Form label styling.
   ------------------------------------------------------------------ */
.careers-form label:not(.cv-upload):not(.careers-check) > span,
.careers-phone-label{
  font-size:12px!important;
  line-height:normal!important;
  font-weight:800!important;
  letter-spacing:normal!important;
  color:#405048!important;
  -webkit-font-smoothing:antialiased!important;
  text-rendering:auto!important;
}

/* ------------------------------------------------------------------
   2) Tablet / phone recruitment form: one single vertical rhythm.
   No stacked margin + grid-gap combinations anymore.
   ------------------------------------------------------------------ */
@media(max-width:980px){
  .careers-form{
    display:grid!important;
    row-gap:18px!important;
  }

  .careers-field-row{
    grid-template-columns:1fr!important;
    gap:18px!important;
    margin:0!important;
  }

  .careers-field-row > label,
  .careers-field-row > .careers-phone-field,
  .careers-form > label:not(.cv-upload):not(.careers-check),
  .careers-form > .cv-upload,
  .careers-form > .careers-check,
  .careers-form > .careers-submit{
    margin:0!important;
  }

  .careers-phone-field{
    margin:0!important;
  }

  /* Empty status must not create a fake extra gap below the button. */
  .careers-status:not(.is-visible){
    display:none!important;
  }

  .careers-status.is-visible{
    margin:0!important;
  }
}

/* ------------------------------------------------------------------
   3) Contact: align the "Formular de contact" bubble with email bubbles.
   The email bubbles already sit 8px left on phones, so move only this
   compact bubble by the same amount.
   ------------------------------------------------------------------ */
@media(max-width:640px){
  .contact-email-block .contact-form-jump{
    margin-left:-8px!important;
    margin-right:0!important;
  }
}

/* ------------------------------------------------------------------
   4) Main contact form on phones: one consistent 18px box-to-box rhythm.
   Remove the old double spacing caused by label margin + field-row gap.
   ------------------------------------------------------------------ */
@media(max-width:640px){
  .visit-form .field-row{
    gap:18px!important;
    margin:0 0 18px!important;
  }

  .visit-form .field-row > label,
  .visit-form .field-row > .phone-field{
    margin-bottom:0!important;
  }

  .visit-form > label:not(.check):not(.company-field){
    margin-bottom:18px!important;
  }

  .visit-form > .company-field.is-visible{
    margin-bottom:18px!important;
  }

  .visit-form > .company-field:not(.is-visible){
    margin-bottom:0!important;
  }

  .visit-form > .other-service-field{
    margin-top:0!important;
  }

  .visit-form > .other-service-field.is-visible{
    margin-bottom:18px!important;
  }

  .visit-form > .other-service-field:not(.is-visible){
    margin-bottom:0!important;
  }

  .visit-form > .check{
    margin:0 0 18px!important;
  }
}


/* ===== V5.14 — fix first recruitment-field gap ===== */

@media(max-width:980px){
  /*
    Override the older, more-specific label margin that was still surviving
    on "Nume și prenume". The grid gap alone now controls spacing.
  */
  .careers-form .careers-field-row > label:not(.cv-upload):not(.careers-check){
    margin:0!important;
  }

  .careers-form .careers-field-row > .careers-phone-field{
    margin:0!important;
  }
}


/* ===== V5.15 — device location helper for Localitate ===== */

.city-location-field{
  min-width:0;
}

.location-input-wrap{
  position:relative;
  width:100%;
}

.location-input-wrap #city-input{
  padding-right:58px!important;
}

.location-use-btn{
  position:absolute;
  top:50%;
  right:6px;
  width:38px;
  height:38px;
  transform:translateY(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:0;
  border:1px solid rgba(18,112,78,.16);
  border-radius:10px;
  background:
    linear-gradient(145deg,rgba(238,249,244,.98),rgba(226,243,235,.96));
  color:#13704f;

  cursor:pointer;
  outline:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.86),
    0 3px 9px rgba(8,39,31,.045);

  -webkit-tap-highlight-color:transparent;
  -webkit-user-select:none;
  user-select:none;
  touch-action:manipulation;

  transition:
    transform .20s cubic-bezier(.2,.8,.2,1),
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    color .22s ease;
}

.location-use-btn:hover{
  color:var(--green-800);
  border-color:rgba(18,112,78,.26);
  background:
    linear-gradient(145deg,rgba(234,248,241,1),rgba(216,239,228,.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 5px 13px rgba(8,39,31,.07);
  transform:translateY(calc(-50% - 1px));
}

.location-use-btn:active{
  transform:translateY(-50%) scale(.94);
}

.location-use-btn:focus-visible{
  box-shadow:
    0 0 0 3px rgba(22,132,94,.13),
    inset 0 1px 0 rgba(255,255,255,.9);
}

.location-use-icon{
  width:20px;
  height:20px;
  display:block;
  transition:opacity .18s ease, transform .25s ease;
}

.location-use-btn.is-loading{
  cursor:wait;
  pointer-events:none;
}

.location-use-btn.is-loading .location-use-icon{
  opacity:.18;
  transform:scale(.84);
}

.location-use-btn.is-loading::after{
  content:"";
  position:absolute;
  width:17px;
  height:17px;
  border:2px solid rgba(19,112,79,.18);
  border-top-color:#13704f;
  border-radius:50%;
  animation:clean4uLocationSpin .68s linear infinite;
}

@keyframes clean4uLocationSpin{
  to{transform:rotate(360deg)}
}

.location-status{
  display:block;
  max-height:0;
  opacity:0;
  overflow:hidden;
  margin-top:0;
  color:#687970;
  font-size:10.5px;
  font-weight:600;
  line-height:1.35;
  transform:translateY(-2px);

  transition:
    max-height .28s cubic-bezier(.2,.8,.2,1),
    opacity .20s ease,
    transform .28s cubic-bezier(.2,.8,.2,1),
    margin-top .28s ease,
    color .20s ease;
}

.location-status.is-visible{
  max-height:42px;
  opacity:1;
  margin-top:4px;
  transform:translateY(0);
}

.location-status.is-success{
  color:#147550;
}

.location-status.is-error{
  color:#9a4b43;
}

#city-input.is-location-filled{
  animation:clean4uLocationFilled .85s cubic-bezier(.2,.75,.22,1);
}

@keyframes clean4uLocationFilled{
  0%{
    border-color:#cedbd4;
    box-shadow:none;
  }
  34%{
    border-color:rgba(28,153,105,.55);
    box-shadow:0 0 0 4px rgba(28,153,105,.10);
  }
  100%{
    border-color:#cedbd4;
    box-shadow:none;
  }
}

.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

@media(max-width:640px){
  .location-input-wrap #city-input{
    padding-right:62px!important;
  }

  .location-use-btn{
    width:40px;
    height:40px;
    right:6px;
    border-radius:11px;
  }

  .location-use-icon{
    width:21px;
    height:21px;
  }

  .location-status{
    font-size:10.5px;
  }
}

@media(prefers-reduced-motion:reduce){
  .location-use-btn,
  .location-use-icon,
  .location-status,
  #city-input.is-location-filled{
    transition:none!important;
    animation:none!important;
  }
}


/* ===== V5.16 — Localitate + adresă GPS precision / balanced GPS button ===== */

.location-input-wrap #city-input{
  padding-right:54px!important;
}

/*
  Standard form input is ~47px high. A 37px control with 5px inset produces
  visually equal breathing room on top, bottom and right.
*/
.location-use-btn{
  width:37px!important;
  height:37px!important;
  right:5px!important;
  border-radius:9px!important;
}

.location-use-icon{
  width:19px!important;
  height:19px!important;
}

.location-use-btn.is-loading::after{
  width:16px!important;
  height:16px!important;
}

@media(max-width:640px){
  .location-input-wrap #city-input{
    padding-right:54px!important;
  }

  .location-use-btn{
    width:37px!important;
    height:37px!important;
    right:5px!important;
    border-radius:9px!important;
  }

  .location-use-icon{
    width:19px!important;
    height:19px!important;
  }
}



/* ===== V5.17 — dropdown coordination, tablet portrait polish, iPad touch states ===== */

/* Language dropdown now leaves with the same calm motion it uses on entry. */
.mobile-lang-menu{
  animation:none!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-5px) scale(.985);
  transform-origin:top right;
  transition:
    opacity .22s ease,
    transform .24s cubic-bezier(.2,.8,.2,1),
    visibility 0s linear .24s!important;
}
.mobile-lang-menu.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
  transition-delay:0s!important;
}
.mobile-lang-menu.is-closing{
  opacity:0;
  visibility:visible;
  pointer-events:none;
  transform:translateY(-5px) scale(.985);
}
.mobile-lang-menu[hidden]{display:none!important}

/* Draw the + geometrically instead of relying on a font glyph baseline.
   This keeps it dead-center in Safari/iPad as well as Chromium. */
.other-service-card .other-service-label:before{
  content:""!important;
  position:relative!important;
  width:22px!important;
  height:22px!important;
  flex:0 0 22px!important;
  display:block!important;
  border-radius:50%!important;
  background:
    linear-gradient(#fff,#fff) center/10px 2px no-repeat,
    linear-gradient(#fff,#fff) center/2px 10px no-repeat,
    linear-gradient(145deg,#1a9a6b,#0d6c4e)!important;
}

/* Tablet portrait only — phone and desktop/landscape rules stay untouched. */
@media (min-width:641px) and (max-width:1100px) and (orientation:portrait){
  .hero-grid{
    grid-template-columns:1fr!important;
    max-width:none!important;
    gap:32px!important;
  }

  .hero-copy{
    width:100%!important;
    max-width:none!important;
  }

  .hero-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    width:100%!important;
    max-width:none!important;
  }

  .hero-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:56px!important;
    padding-inline:18px!important;
    text-align:center!important;
  }

  .hero-card{
    width:100%!important;
    max-width:none!important;
    justify-self:stretch!important;
  }

  .hero-card-body{
    padding-left:38px!important;
    padding-right:38px!important;
  }

  /* Use the available portrait width instead of leaving a large dead area.
     This mirrors the desktop/landscape structure, just with tighter geometry. */
  .contact-panel{
    grid-template-columns:minmax(155px,.40fr) minmax(0,1.60fr)!important;
    gap:30px!important;
    align-items:start!important;
    padding:34px!important;
  }

  .contact-links{
    grid-template-columns:minmax(160px,.82fr) minmax(0,1.18fr)!important;
    gap:22px!important;
    align-items:start!important;
    min-width:0!important;
  }

  .contact-phone-block,
  .contact-email-block{
    min-width:0!important;
  }

  .contact-email-block .contact-inline-link{
    width:100%!important;
    max-width:100%!important;
    padding-left:16px!important;
    padding-right:14px!important;
  }

  .contact-email-block .contact-inline-link strong{
    white-space:nowrap!important;
    overflow:visible!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    text-overflow:clip!important;
    font-size:13px!important;
    letter-spacing:-.012em!important;
  }
}

/* iPad / touch-tablet form polish. Safari must not add a hard blue tap state,
   and all our custom focus rings should ease in just like on phone/desktop. */
@media (min-width:641px) and (max-width:1400px) and (pointer:coarse){
  .visit-form input,
  .visit-form textarea,
  .visit-form select,
  .form-select-trigger,
  .dial-trigger,
  .dial-search input,
  .dial-custom-input,
  .careers-form input,
  .careers-form textarea,
  .cv-upload,
  .check input,
  .careers-check input{
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
  }

  .visit-form input:not([type="checkbox"]),
  .visit-form textarea,
  .careers-form input:not([type="checkbox"]),
  .careers-form textarea,
  .dial-search input,
  .dial-custom-input{
    -webkit-appearance:none!important;
    appearance:none!important;
    outline:none!important;
    font-size:16px!important;
    transition:
      border-color .24s ease,
      box-shadow .26s cubic-bezier(.2,.8,.2,1),
      background-color .24s ease!important;
  }

  .form-select-trigger,
  .dial-trigger{
    outline:none!important;
    transition:
      border-color .24s ease,
      box-shadow .26s cubic-bezier(.2,.8,.2,1),
      background-color .24s ease,
      transform .20s cubic-bezier(.2,.8,.2,1)!important;
  }

  .visit-form input:focus,
  .visit-form textarea:focus,
  .careers-form input:focus,
  .careers-form textarea:focus{
    outline:none!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mobile-lang-menu{transition:none!important}
}


/* ===== V5.18 — Portfolio + FAQ as separate site destinations ===== */

/* Two additional bubbles participate naturally in the hamburger entrance. */
@media(max-width:980px){
  .main-nav.open > a:not(.btn):nth-of-type(5){
    transition-delay:.165s, .165s, 0s, 0s, 0s!important;
  }
  .main-nav.open > a:not(.btn):nth-of-type(6){
    transition-delay:.195s, .195s, 0s, 0s, 0s!important;
  }
}

/*
  The extra destinations make a full desktop navigation too dense around
  classic 1024px tablet / small-laptop widths. Only the HEADER switches to
  hamburger here; page layout remains the existing landscape/tablet layout.
*/
@media(min-width:981px) and (max-width:1320px){
  .site-header .nav-wrap{
    position:relative;
    justify-content:flex-start!important;
    gap:12px!important;
  }

  .site-header .brand{
    order:1!important;
  }

  .site-header .mobile-lang-dropdown{
    order:2!important;
    margin-left:auto!important;
  }

  .site-header .menu-toggle{
    order:3!important;
    display:block!important;
    margin-left:2px!important;
    flex:0 0 auto!important;
  }

  .site-header .main-nav{
    order:4!important;
    display:flex!important;
    position:absolute!important;
    top:calc(100% + 10px)!important;
    left:20px!important;
    right:20px!important;
    z-index:240!important;

    flex-direction:column!important;
    align-items:flex-start!important;
    gap:13px!important;
    padding:18px!important;

    background:rgba(255,255,255,.985)!important;
    border:1px solid rgba(18,112,78,.13)!important;
    border-radius:22px!important;
    box-shadow:0 18px 42px rgba(8,39,31,.13)!important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-14px) scale(.985)!important;
    transform-origin:top center!important;

    transition:
      opacity .24s ease,
      transform .34s cubic-bezier(.16,1,.3,1),
      visibility 0s linear .34s,
      box-shadow .34s ease!important;
  }

  .site-header .main-nav.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0) scale(1)!important;
    transition:
      opacity .24s ease,
      transform .34s cubic-bezier(.16,1,.3,1),
      visibility 0s linear 0s,
      box-shadow .34s ease!important;
  }

  .site-header .main-nav > a:not(.btn){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    align-self:flex-start!important;

    width:max-content!important;
    min-width:148px!important;
    max-width:100%!important;
    min-height:44px!important;
    box-sizing:border-box!important;

    padding:11px 17px!important;
    margin:0!important;

    border:1px solid rgba(18,112,78,.13)!important;
    border-radius:999px!important;
    background:linear-gradient(
      180deg,
      rgba(250,253,251,.99) 0%,
      rgba(237,247,242,.98) 100%
    )!important;

    color:#173d30!important;
    text-align:left!important;
    font-size:14px!important;
    font-weight:850!important;
    line-height:1.1!important;
    text-shadow:none!important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.95),
      0 5px 14px rgba(8,39,31,.045)!important;

    opacity:0;
    transform:translateY(-7px)!important;
    -webkit-tap-highlight-color:transparent!important;

    transition:
      opacity .24s ease,
      transform .32s cubic-bezier(.16,1,.3,1),
      background .20s ease,
      border-color .20s ease,
      box-shadow .20s ease!important;
  }

  .site-header .main-nav > a:not(.btn)::after{
    display:none!important;
  }

  .site-header .main-nav.open > a:not(.btn){
    opacity:1;
    transform:translateY(0)!important;
  }

  .site-header .main-nav.open > a:not(.btn):nth-of-type(1){transition-delay:.045s, .045s, 0s, 0s, 0s!important}
  .site-header .main-nav.open > a:not(.btn):nth-of-type(2){transition-delay:.075s, .075s, 0s, 0s, 0s!important}
  .site-header .main-nav.open > a:not(.btn):nth-of-type(3){transition-delay:.105s, .105s, 0s, 0s, 0s!important}
  .site-header .main-nav.open > a:not(.btn):nth-of-type(4){transition-delay:.135s, .135s, 0s, 0s, 0s!important}
  .site-header .main-nav.open > a:not(.btn):nth-of-type(5){transition-delay:.165s, .165s, 0s, 0s, 0s!important}
  .site-header .main-nav.open > a:not(.btn):nth-of-type(6){transition-delay:.195s, .195s, 0s, 0s, 0s!important}

  .site-header .main-nav > a:not(.btn):active{
    transform:scale(.985)!important;
    background:#e9f5ef!important;
    border-color:rgba(18,112,78,.23)!important;
  }

  .site-header .main-nav > .btn{
    align-self:stretch!important;
    width:100%!important;
    margin-top:5px!important;
    text-align:center!important;
  }

  .site-header .main-nav .lang-switch{
    display:none!important;
  }

  .site-header .menu-toggle,
  .site-header .menu-toggle *,
  .site-header .main-nav,
  .site-header .main-nav *{
    -webkit-tap-highlight-color:transparent!important;
  }

  .site-header .menu-toggle span{
    transform-origin:center!important;
    transition:
      transform .30s cubic-bezier(.16,1,.3,1),
      opacity .18s ease,
      width .24s ease!important;
  }

  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(1){
    transform:translateY(7px) rotate(45deg)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(2){
    opacity:0!important;
    transform:scaleX(.35)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(3){
    transform:translateY(-7px) rotate(-45deg)!important;
  }
}

/* Give the two destination links the same touch cleanliness as local anchors. */
.nav-destination-link{
  -webkit-tap-highlight-color:transparent;
}



/* ===== Source style block 3: anonymous ===== */

/* Reserved page shell: intentionally empty until real content is supplied. */
.reserved-page{
  min-height:clamp(420px,62svh,760px);
  position:relative;
  background:
    radial-gradient(circle at 18% 12%,rgba(63,171,120,.08),transparent 29%),
    linear-gradient(180deg,#f4faf6 0%,#ffffff 72%);
}
.reserved-page-title{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.main-nav > a[aria-current="page"]{
  color:var(--green-700)!important;
}
@media(min-width:1121px){
  .main-nav > a[aria-current="page"]::after{
    opacity:.9!important;
    transform:translateX(-50%) scaleX(1)!important;
  }
}
@media(max-width:1120px){
  .main-nav > a[aria-current="page"]{
    background:#e5f4ec!important;
    border-color:rgba(18,112,78,.25)!important;
  }
}

/* ===== V5.22 — stable wide desktop header ===== */
@media(min-width:1321px){
  .site-header .container.nav-wrap{
    width:min(calc(100% - 24px),1540px)!important;
    max-width:none!important;
    gap:12px!important;
  }

  .site-header .main-nav{
    flex-wrap:nowrap!important;
    gap:clamp(9px,.72vw,16px)!important;
    min-width:0!important;
  }

  .site-header .main-nav > a{
    white-space:nowrap!important;
  }

  .site-header .brand{
    flex:0 0 auto!important;
  }
}



/* ===== Source style block 4: clean4u-v523-theme ===== */

/* ===== V5.23 — premium light/dark appearance layer ===== */
:root{
  --theme-bg:#ffffff;
  --theme-bg-soft:#eef5f1;
  --theme-surface:#ffffff;
  --theme-surface-raised:#fbfdfc;
  --theme-text:#14201b;
  --theme-muted:#68746e;
  --theme-border:#dfe8e3;
  --theme-header:rgba(247,250,248,.90);
}

html[data-theme="dark"]{
  color-scheme:dark;
  --theme-bg:#07110e;
  --theme-bg-soft:#0b1b15;
  --theme-surface:#0d1b16;
  --theme-surface-raised:#10221b;
  --theme-text:#ecf7f2;
  --theme-muted:#a6bbb2;
  --theme-border:rgba(187,223,206,.15);
  --theme-header:rgba(7,17,14,.88);
  --ink:#ecf7f2;
  --muted:#a6bbb2;
  --line:rgba(187,223,206,.15);
  --shadow:0 22px 62px rgba(0,0,0,.34);
}


.theme-toggle{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:inline-grid;
  place-items:center;
  position:relative;
  padding:0;
  border:1px solid #d5e3dc;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  color:#194f3b;
  box-shadow:0 5px 15px rgba(8,39,31,.055),inset 0 1px 0 rgba(255,255,255,.85);
  cursor:pointer;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:
    transform .24s cubic-bezier(.2,.8,.2,1),
    background-color .38s ease,
    border-color .38s ease,
    color .38s ease,
    box-shadow .38s ease!important;
}
.theme-toggle:hover{
  transform:translateY(-1px);
  border-color:#b8d3c6;
  box-shadow:0 7px 19px rgba(8,39,31,.09),inset 0 1px 0 rgba(255,255,255,.9);
}
.theme-toggle:active{transform:scale(.94)}
.theme-toggle:focus-visible{outline:3px solid rgba(54,184,125,.18);outline-offset:3px}
.theme-toggle svg{
  position:absolute;
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:opacity .30s ease,transform .42s cubic-bezier(.2,.8,.2,1);
}
.theme-toggle .theme-sun{opacity:0;transform:rotate(-70deg) scale(.55)}
.theme-toggle .theme-moon{opacity:1;transform:rotate(0) scale(1)}
html[data-theme="dark"] .theme-toggle{
  background:linear-gradient(145deg,#10261e,#0a1813);
  border-color:rgba(142,211,176,.22);
  color:#b8f0d3;
  box-shadow:0 8px 20px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.05);
}
html[data-theme="dark"] .theme-toggle .theme-sun{opacity:1;transform:rotate(0) scale(1)}
html[data-theme="dark"] .theme-toggle .theme-moon{opacity:0;transform:rotate(70deg) scale(.55)}
.theme-toggle-mobile{display:none}

/* Core canvas */
html[data-theme="dark"] body{background:#07110e!important;color:#ecf7f2!important}
html[data-theme="dark"] .site-header{
  background:rgba(7,17,14,.88)!important;
  border-bottom-color:rgba(190,225,208,.10)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.08);
}
html[data-theme="dark"] .main-nav>a:not(.btn){color:#d7ebe2}
html[data-theme="dark"] .main-nav>a:not(.btn):hover{color:#83d9af!important}
html[data-theme="dark"] .menu-toggle span{background:#e8f5ef!important}

/* Language controls */
html[data-theme="dark"] .lang-switch{background:#0b1813!important;border-color:rgba(182,221,203,.14)!important}
html[data-theme="dark"] .lang-choice{color:#a9bdb4!important}
html[data-theme="dark"] .lang-choice:hover{background:rgba(255,255,255,.055)!important;color:#c8f0dc!important}
html[data-theme="dark"] .lang-choice.is-active{background:#162a22!important;color:#9ce6bf!important;box-shadow:0 3px 10px rgba(0,0,0,.22)!important}
html[data-theme="dark"] .mobile-lang-trigger{
  background:#0e1e18!important;color:#dff2e9!important;border-color:rgba(182,221,203,.16)!important;box-shadow:0 8px 20px rgba(0,0,0,.20)!important
}
html[data-theme="dark"] .mobile-lang-trigger:hover,
html[data-theme="dark"] .mobile-lang-trigger[aria-expanded="true"]{background:#142820!important}
html[data-theme="dark"] .mobile-lang-menu{
  background:rgba(11,24,19,.985)!important;border-color:rgba(163,218,191,.17)!important;box-shadow:0 24px 58px rgba(0,0,0,.38)!important
}
html[data-theme="dark"] .mobile-lang-option{color:#d7e9e1!important}
html[data-theme="dark"] .mobile-lang-option:hover,
html[data-theme="dark"] .mobile-lang-option:focus-visible{background:#152a21!important}
html[data-theme="dark"] .mobile-lang-option.is-selected{background:#183529!important;color:#a9e8c8!important}
html[data-theme="dark"] .mobile-lang-option .lang-option-code{color:#899f95!important}
html[data-theme="dark"] .mobile-lang-option.is-selected .lang-option-code{color:#79d6a9!important}

/* Hero */
html[data-theme="dark"] .hero{
  background:linear-gradient(135deg,#07110e 0%,#0a1a14 48%,#08130f 100%)!important
}
html[data-theme="dark"] .hero:after{
  background-image:linear-gradient(rgba(153,221,188,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(153,221,188,.055) 1px,transparent 1px)!important
}
html[data-theme="dark"] .hero-glow-1{background:#123f2f!important;opacity:.40!important}
html[data-theme="dark"] .hero-glow-2{background:#0d3326!important;opacity:.42!important}
html[data-theme="dark"] .hero-lead,
html[data-theme="dark"] .copy,
html[data-theme="dark"] .check-list li{color:#a9bdb4!important}
html[data-theme="dark"] .hero-trust b{color:#dff2e9!important}
html[data-theme="dark"] .hero-card{
  background:rgba(13,29,23,.91)!important;
  border-color:rgba(179,224,203,.13)!important;
  box-shadow:0 26px 70px rgba(0,0,0,.28)!important
}
html[data-theme="dark"] .hero-card-top{background:linear-gradient(120deg,#0b382a,#14543e)!important}
html[data-theme="dark"] .hero-card .mini-label{color:#72d6a5!important}
html[data-theme="dark"] .phone-link{
  background:#0c1a15!important;color:#eaf6f0!important;border-color:rgba(99,196,149,.25)!important;box-shadow:0 10px 25px rgba(0,0,0,.20)!important
}
html[data-theme="dark"] .phone-link:hover{background:#11241c!important;border-color:rgba(111,214,165,.40)!important}
html[data-theme="dark"] .hero-pro{filter:drop-shadow(0 1px 0 rgba(255,255,255,.08))!important}

/* Section canvases */
html[data-theme="dark"] .section:not(.section-soft){background:#07110e!important}
html[data-theme="dark"] .section-soft{background:linear-gradient(180deg,#0a1813 0%,#0d2119 100%)!important}
html[data-theme="dark"] #contact.section,
html[data-theme="dark"] .careers-section{background:#07110e!important}
html[data-theme="dark"] .section-heading.centered p:last-child,
html[data-theme="dark"] .form-copy>p:not(.eyebrow),
html[data-theme="dark"] .careers-copy>p:not(.eyebrow){color:#a6bbb2!important}
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .eyebrow.emphasis,
html[data-theme="dark"] .form-copy .eyebrow.emphasis,
html[data-theme="dark"] .careers-eyebrow{color:#6ed1a1!important}

html[data-theme="dark"] .coverage-card{
  background:#0f211a!important;border-left-color:#3ead79!important
}
html[data-theme="dark"] .coverage-card strong{color:#dcefe6!important}
html[data-theme="dark"] .coverage-card p{color:#9fb5ab!important}

/* Cards / services / process */
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .process-step{
  background:linear-gradient(145deg,#0e1d17,#0b1713)!important;
  border-color:rgba(177,221,200,.13)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.18)!important
}
html[data-theme="dark"] .service-card:hover,
html[data-theme="dark"] .process-step:hover{
  border-color:rgba(112,207,160,.30)!important;
  box-shadow:0 20px 48px rgba(0,0,0,.28)!important
}
html[data-theme="dark"] .service-card p,
html[data-theme="dark"] .process-step p{color:#9fb4aa!important}
html[data-theme="dark"] .service-media{background:linear-gradient(135deg,#11281f,#17372a)!important}
html[data-theme="dark"] .service-media img{filter:saturate(.78) contrast(.98) brightness(.82)!important}
html[data-theme="dark"] .service-card:hover .service-media img{filter:saturate(.90) contrast(1.02) brightness(.90)!important}
html[data-theme="dark"] .process-step{border-top-color:rgba(182,223,204,.15)!important}

/* B2B remains an intentionally brighter brand-green island. */
html[data-theme="dark"] .b2b-card{
  background:linear-gradient(120deg,#061f18,#0d4b37 52%,#126748)!important;
  box-shadow:0 26px 64px rgba(0,0,0,.27)!important
}

/* Main form, contact and recruitment */
html[data-theme="dark"] .visit-form,
html[data-theme="dark"] .contact-panel,
html[data-theme="dark"] .careers-card{
  background:#0c1914!important;
  border-color:rgba(185,223,205,.13)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.22)!important
}
html[data-theme="dark"] .careers-card::after{box-shadow:0 18px 46px rgba(0,0,0,.22)!important}
html[data-theme="dark"] .careers-form{
  background:#0f2019!important;
  border-color:rgba(180,222,202,.13)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important
}
html[data-theme="dark"] .visit-form label,
html[data-theme="dark"] .phone-field>span,
html[data-theme="dark"] .careers-form label:not(.cv-upload):not(.careers-check)>span,
html[data-theme="dark"] .careers-phone-label{color:#bcd0c6!important}
html[data-theme="dark"] .contact-mini strong,
html[data-theme="dark"] .contact-links strong,
html[data-theme="dark"] .cv-upload-copy strong{color:#dceee6!important}
html[data-theme="dark"] .contact-mini span,
html[data-theme="dark"] .contact-links span,
html[data-theme="dark"] .cv-upload-copy small,
html[data-theme="dark"] .careers-note{color:#94aba0!important}

/* Native/custom form controls */
html[data-theme="dark"] .visit-form input,
html[data-theme="dark"] .visit-form select,
html[data-theme="dark"] .visit-form textarea,
html[data-theme="dark"] .careers-form input[type="text"],
html[data-theme="dark"] .careers-form input[type="tel"],
html[data-theme="dark"] .careers-form input[type="email"],
html[data-theme="dark"] .form-select-trigger,
html[data-theme="dark"] .phone-input-group,
html[data-theme="dark"] .careers-phone-input-group,
html[data-theme="dark"] .dial-trigger{
  background:#0a1712!important;
  color:#e7f4ee!important;
  border-color:rgba(183,221,203,.17)!important
}
html[data-theme="dark"] .visit-form input:focus,
html[data-theme="dark"] .visit-form select:focus,
html[data-theme="dark"] .visit-form textarea:focus,
html[data-theme="dark"] .careers-form input:focus,
html[data-theme="dark"] .phone-input-group:focus-within,
html[data-theme="dark"] .careers-phone-input-group:focus-within,
html[data-theme="dark"] .form-select-trigger[aria-expanded="true"]{
  background:#0d1d17!important;
  border-color:#2f9569!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.12)!important
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:#6f867b!important;opacity:1}
html[data-theme="dark"] .form-select-value.is-placeholder{color:#71877c!important}
html[data-theme="dark"] .form-select-chevron,
html[data-theme="dark"] .dial-chevron{color:#88a097!important}

html[data-theme="dark"] .form-select-menu,
html[data-theme="dark"] .dial-menu{
  background:rgba(10,23,18,.99)!important;
  border-color:rgba(165,218,190,.17)!important;
  box-shadow:0 24px 62px rgba(0,0,0,.42)!important
}
html[data-theme="dark"] .form-select-option,
html[data-theme="dark"] .dial-option{color:#d5e7df!important}
html[data-theme="dark"] .form-select-option:hover,
html[data-theme="dark"] .form-select-option:focus-visible,
html[data-theme="dark"] .dial-option:hover,
html[data-theme="dark"] .dial-option:focus-visible{background:#14291f!important;color:#c5f0da!important}
html[data-theme="dark"] .form-select-option.is-selected,
html[data-theme="dark"] .dial-option.is-selected{background:#18352a!important;color:#a9e6c7!important}
html[data-theme="dark"] .dial-option-code{color:#86a095!important}
html[data-theme="dark"] .dial-search{
  background:#0e1e18!important;border-color:rgba(180,220,201,.15)!important
}
html[data-theme="dark"] .dial-search:focus-within{background:#11251d!important;border-color:#2f9569!important}
html[data-theme="dark"] .dial-custom-wrap{background:#091611!important;border-top-color:rgba(181,220,202,.11)!important}
html[data-theme="dark"] .dial-custom-toggle{color:#c7dad1!important}
html[data-theme="dark"] .dial-custom-toggle:hover{background:#14291f!important}
html[data-theme="dark"] .dial-custom-input-wrap{background:#0f211a!important;border-color:rgba(184,221,204,.16)!important;color:#8ee0b8!important}
html[data-theme="dark"] .cv-upload{
  background:rgba(46,166,112,.07)!important;
  border-color:rgba(101,205,155,.25)!important
}
html[data-theme="dark"] .cv-upload:hover{background:rgba(46,166,112,.11)!important;border-color:rgba(112,216,165,.36)!important}

/* Contact cards/buttons */
html[data-theme="dark"] .contact-mini a:hover,
html[data-theme="dark"] .contact-links a:hover,
html[data-theme="dark"] .contact-inline-link:hover{background:rgba(83,189,139,.075)!important}
html[data-theme="dark"] .contact-inline-link{background:rgba(76,178,131,.055)!important}
html[data-theme="dark"] .contact-action-btn{
  background:#101f19!important;color:#dff1e8!important;border-color:rgba(184,222,204,.15)!important;box-shadow:0 8px 20px rgba(0,0,0,.17)!important
}
html[data-theme="dark"] .contact-action-btn:hover{background:#152a21!important;border-color:rgba(112,207,160,.26)!important}
html[data-theme="dark"] .contact-action-btn.whatsapp{color:#073326!important}
html[data-theme="dark"] .location-use-btn{
  background:linear-gradient(145deg,#11291f,#0c1c16)!important;
  color:#7bd9ac!important;
  border-color:rgba(111,205,160,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 4px 11px rgba(0,0,0,.16)!important
}

/* Footer / reserved future pages */
html[data-theme="dark"] .site-footer{background:#04100c!important;border-top:1px solid rgba(190,225,208,.06)}
html[data-theme="dark"] .reserved-page{
  background:radial-gradient(circle at 18% 12%,rgba(63,171,120,.10),transparent 30%),linear-gradient(180deg,#07110e 0%,#0b1a14 72%)!important
}

/* Hamburger surface when the header collapses. */
@media(max-width:1320px){
  .theme-toggle-mobile{display:inline-grid}
  .theme-toggle-desktop{display:none!important}

  html[data-theme="dark"] .site-header .main-nav{
    background:rgba(9,22,17,.985)!important;
    border-color:rgba(177,221,200,.14)!important;
    box-shadow:0 20px 48px rgba(0,0,0,.34)!important
  }
  html[data-theme="dark"] .site-header .main-nav>a:not(.btn){
    background:linear-gradient(180deg,#10231b 0%,#0b1914 100%)!important;
    border-color:rgba(178,221,201,.13)!important;
    color:#d8ece3!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 5px 14px rgba(0,0,0,.14)!important
  }
}

@media(min-width:981px) and (max-width:1320px){
  .site-header .theme-toggle-mobile{
    order:3!important;
    margin-left:0!important;
  }
  .site-header .menu-toggle{order:4!important}
  .site-header .main-nav{order:5!important}
}

@media(min-width:1321px){
  .theme-toggle-desktop{display:inline-grid}
}

@media(max-width:360px){
  .theme-toggle-mobile{display:none!important}
  .site-header .main-nav .theme-toggle-desktop{
    display:inline-grid!important;
    align-self:flex-start!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .theme-toggle,
  .theme-toggle svg,
  body,.site-header,.hero,.section,.section-soft,.hero-card,.service-card,.process-step,.visit-form,.contact-panel,.careers-card,.careers-form,.reserved-page{
    transition:none!important
  }
}


/* ===== Source style block 5: clean4u-v523-theme-refinements ===== */

/* V5.23 dark-mode refinements after visual validation. */
::view-transition-old(root),
::view-transition-new(root){
  animation-duration:.42s;
  animation-timing-function:cubic-bezier(.2,.8,.2,1);
}

html[data-theme="dark"] .site-header .brand img{
  background:rgba(255,255,255,.96);
  border-radius:11px;
  padding:4px 7px;
  box-shadow:0 5px 16px rgba(0,0,0,.16);
}
html[data-theme="dark"] .about-mini-logo{
  background:rgba(255,255,255,.94);
  border-radius:6px;
  padding:2px 4px;
}
html[data-theme="dark"] .skip-link{background:#10231b!important;color:#e9f6f0!important}

/* The services transition used to fade all the way to white. In dark mode it
   now lands seamlessly into the dark canvas while preserving the long fade. */
html[data-theme="dark"] .services-stage:after{
  background:linear-gradient(180deg,
    #0d4635 0%,
    #124d3b 10%,
    #18543f 21%,
    #1d5a44 33%,
    #1b523f 45%,
    #173f31 58%,
    #122e24 70%,
    #0e221b 81%,
    #0b1a15 90%,
    #08130f 96%,
    #07110e 100%
  )!important;
}

html[data-theme="dark"] .form-copy .form-copy-action{
  color:#72d7a6!important;
}
html[data-theme="dark"] .form-copy .form-copy-action:hover{
  color:#a9edcb!important;
  background:rgba(92,208,153,.075)!important;
}
html[data-theme="dark"] .contact-form-jump{
  color:#8be0b7!important;
  background:rgba(73,187,136,.09)!important;
  border-color:rgba(103,207,158,.22)!important;
}
html[data-theme="dark"] .contact-form-jump:hover{
  color:#b6f1d3!important;
  background:rgba(73,187,136,.14)!important;
}

/* Preserve the WhatsApp brand treatment; only the neutral contact button is dark. */
html[data-theme="dark"] .contact-action-btn.whatsapp{
  background:linear-gradient(112deg,#16bf57 0%,#25d366 38%,#58e78f 50%,#21cb61 63%,#14ac4f 100%)!important;
  background-size:220% 100%!important;
  border-color:rgba(109,218,158,.34)!important;
  color:#073326!important;
  box-shadow:0 10px 24px rgba(18,168,79,.19),inset 0 1px 0 rgba(255,255,255,.24)!important;
}
html[data-theme="dark"] .contact-action-btn.whatsapp:hover{
  background:linear-gradient(112deg,#14b14f 0%,#21c95f 39%,#4dde84 51%,#1bb95a 64%,#129247 100%)!important;
  background-size:220% 100%!important;
}

html[data-theme="dark"] .cv-file-name{
  background:#13271f!important;
  border-color:rgba(121,211,168,.18)!important;
  color:#c9eadb!important;
}
html[data-theme="dark"] .check input[type="checkbox"],
html[data-theme="dark"] .careers-check input[type="checkbox"]{
  background:#0a1712!important;
  border-color:rgba(188,224,207,.34)!important;
}
html[data-theme="dark"] .check input[type="checkbox"]:checked,
html[data-theme="dark"] .careers-check input[type="checkbox"]:checked{
  background:#17865f!important;
  border-color:#17865f!important;
}
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus{
  -webkit-text-fill-color:#e7f4ee!important;
  -webkit-box-shadow:0 0 0 1000px #0a1712 inset!important;
  caret-color:#e7f4ee!important;
}

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),
  ::view-transition-new(root){animation:none!important}
}


/* ===== Source style block 6: clean4u-v524-polish ===== */

/* ===== V5.24 — dark-mode cleanup + centered expanded desktop header ===== */

/* 1) Dial picker: one clean search surface in dark mode. */
html[data-theme="dark"] .dial-search{
  background:#0e1e18!important;
  border-color:rgba(180,220,201,.15)!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .dial-search:focus-within{
  background:#11251d!important;
  border-color:#2f9569!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.10)!important;
}
html[data-theme="dark"] .dial-search input,
html[data-theme="dark"] .visit-form .dial-search input,
html[data-theme="dark"] .careers-form .dial-search input{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:100%!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  outline:none!important;
  color:#dceee6!important;
  caret-color:#7bd9ac!important;
  padding:11px 0!important;
}
html[data-theme="dark"] .dial-search input::-webkit-search-decoration,
html[data-theme="dark"] .dial-search input::-webkit-search-cancel-button,
html[data-theme="dark"] .dial-search input::-webkit-search-results-button,
html[data-theme="dark"] .dial-search input::-webkit-search-results-decoration{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:none!important;
}

/* Dial country-group separators must belong to the same dark sheet. */
html[data-theme="dark"] .dial-group-title{
  color:#7f9b8e!important;
  background:rgba(10,23,18,.975)!important;
  border:0!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .dial-list{
  scrollbar-color:#315749 transparent!important;
}
html[data-theme="dark"] .dial-empty{
  color:#839b90!important;
}

/* 2) Revealed contextual fields: no light cards flashing through dark mode. */
html[data-theme="dark"] .other-service-card{
  background:linear-gradient(135deg,#10231b,#0c1b15)!important;
  border-color:rgba(80,190,137,.25)!important;
  border-left-color:#2fa777!important;
  box-shadow:0 10px 25px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html[data-theme="dark"] .other-service-card .other-service-label{
  color:#91ddb8!important;
}
html[data-theme="dark"] .other-service-card textarea[name="other_service"]{
  background:#0a1712!important;
  border-color:rgba(126,207,168,.20)!important;
  color:#e7f4ee!important;
}
html[data-theme="dark"] .other-service-card textarea[name="other_service"]:focus{
  background:#0d1d17!important;
  border-color:#2f9569!important;
  box-shadow:0 0 0 3px rgba(62,170,120,.12)!important;
}

html[data-theme="dark"] .company-field{
  background:rgba(9,22,17,0)!important;
  border-color:transparent!important;
  border-left-color:transparent!important;
}
html[data-theme="dark"] .company-field.is-visible{
  background:#0f211a!important;
  border-color:rgba(84,190,139,.23)!important;
  border-left-color:#2fa777!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html[data-theme="dark"] .company-field.is-visible > span{
  color:#9fe2bf!important;
}

/* 3) Checked consent boxes retain the white tick in dark mode. */
html[data-theme="dark"] .check input[type="checkbox"]:checked,
html[data-theme="dark"] .careers-check input[type="checkbox"]:checked{
  background-color:#17865f!important;
  border-color:#17865f!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3 6.4 11.2 12.8 4.8' fill='none' stroke='white' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:12px 12px!important;
  box-shadow:
    0 0 0 3px rgba(22,132,94,.12),
    inset 0 1px 0 rgba(255,255,255,.14)!important;
}

/* 4) Contact hierarchy: phone and emails use the exact same light text tone. */
html[data-theme="dark"] .contact-copy-phone,
html[data-theme="dark"] .contact-copy-phone .copy-phone-value,
html[data-theme="dark"] .contact-email-block .contact-inline-link strong{
  color:#dceee6!important;
}

/* WhatsApp CTA must remain unmistakably white on the brand-green surface. */
html[data-theme="dark"] .contact-action-btn.whatsapp,
html[data-theme="dark"] .contact-action-btn.whatsapp span,
html[data-theme="dark"] .contact-action-btn.whatsapp:hover,
html[data-theme="dark"] .contact-action-btn.whatsapp:hover span{
  color:#fff!important;
}

/*
  5) Expanded desktop header:
  the primary navigation sits in the center of the REAL free corridor between
  the logo (left) and the theme/language/CTA controls (right).
  Equal auto margins are used on both sides of the six primary links.
*/
@media(min-width:1321px){
  .site-header .container.nav-wrap{
    --c4u-header-gap:clamp(9px,.72vw,16px);
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0!important;
  }

  .site-header .brand{
    flex:0 0 auto!important;
    margin-right:var(--c4u-header-gap)!important;
  }

  .site-header .main-nav{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    margin-left:0!important;
    gap:var(--c4u-header-gap)!important;
    justify-content:flex-start!important;
  }

  /* First normal nav item gets the left free space... */
  .site-header .main-nav > a:not(.btn):nth-of-type(1){
    margin-left:auto!important;
  }

  /* ...FAQ is the sixth normal link; it gets the same free space on the right. */
  .site-header .main-nav > a:not(.btn):nth-of-type(6){
    margin-right:auto!important;
  }

  .site-header .main-nav > a:not(.btn){
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }

  .site-header .main-nav .theme-toggle-desktop,
  .site-header .main-nav .lang-switch,
  .site-header .main-nav > .btn{
    flex:0 0 auto!important;
  }
}


/* ===== Source style block 7: clean4u-v525-overflow-fix ===== */

/* ===== V5.25 — remove accidental horizontal page overflow ===== */

/*
  Some desktop browsers count the classic vertical scrollbar inside 100vw.
  The site intentionally contains full-bleed decorative sections, so any
  sub-pixel / scrollbar-width spill must never create a horizontal document
  scrollbar.
*/
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

@supports (overflow:clip){
  html,
  body{
    overflow-x:clip;
  }
}

/* Keep the main structural surfaces constrained to the viewport. */
.site-header,
main,
footer{
  max-width:100%;
}

/*
  The services band remains visually full-bleed, but the document itself
  cannot become horizontally scrollable because of 100vw rounding.
*/
.services-stage{
  max-width:100vw;
}


/* ===== Source style block 8: clean4u-v528-desktop-control-spacing ===== */

/* ===== V5.28 — exact symmetric spacing for desktop header controls ===== */
@media(min-width:1321px){
  /*
    On desktop the visible language selector is OUTSIDE .main-nav.
    The distance Dark mode -> CTA is:
      main-nav gap + the 8px CTA breathing room.
    Reuse that exact computed distance for CTA -> Language.
  */
  .site-header .container.nav-wrap{
    --c4u-header-control-gap:var(--c4u-header-gap);
  }

  .site-header .mobile-lang-dropdown{
    margin-left:var(--c4u-header-control-gap)!important;
    margin-right:0!important;
  }
}


/* ===== Source style block 9: clean4u-v547-header-stability ===== */

/* ===== V5.48 — motionless theme nav + truly symmetric desktop controls ===== */
@media(min-width:1321px){
  .site-header .container.nav-wrap{
    --c4u-header-control-gap:14px;
  }

  /* Treat the desktop nav as ONE snapshot during the theme cross-fade.
     Individual text links no longer receive their own transition geometry,
     so they cannot drift by a pixel while light/dark mode changes. */
  .site-header .main-nav{
    view-transition-name:c4u-main-nav;
  }
  .site-header .main-nav > a:not(.btn){
    view-transition-name:none!important;
  }

  /* Flex gap is already inserted between Theme and CTA. Cancel that gap at
     the CTA edge, then add one explicit control gap on the theme button.
     CTA -> Language uses the exact same explicit value. */
  .site-header .main-nav .theme-toggle-desktop{
    margin-right:var(--c4u-header-control-gap)!important;
  }
  .site-header .main-nav > .btn{
    margin-left:calc(0px - var(--c4u-header-gap))!important;
    margin-right:0!important;
  }
  .site-header .mobile-lang-dropdown{
    margin-left:var(--c4u-header-control-gap)!important;
    margin-right:0!important;
  }
}

@keyframes c4uHeaderNavOld{from{opacity:1}to{opacity:0}}
@keyframes c4uHeaderNavNew{from{opacity:0}to{opacity:1}}

::view-transition-group(c4u-main-nav){
  animation:none!important;
}
::view-transition-image-pair(c4u-main-nav){
  isolation:auto!important;
}
::view-transition-old(c4u-main-nav){
  animation:c4uHeaderNavOld .38s ease both!important;
  mix-blend-mode:normal!important;
  transform:none!important;
}
::view-transition-new(c4u-main-nav){
  animation:c4uHeaderNavNew .38s ease both!important;
  mix-blend-mode:normal!important;
  transform:none!important;
}


/* ===== Source style block 10: clean4u-v539-logo-polish ===== */

/* ===== V5.39 — compact dark-mode logo plate ===== */
html[data-theme="dark"] .site-header .brand{
  padding:2px 5px!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,rgba(249,253,251,.96),rgba(229,241,235,.93))!important;
  border:1px solid rgba(255,255,255,.48)!important;
  box-shadow:0 4px 14px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.82)!important;
  overflow:hidden!important;
}
html[data-theme="dark"] .site-header .brand img{
  width:140px!important;
  height:48px!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
}
@media(max-width:640px){
  html[data-theme="dark"] .site-header .brand{padding:2px 4px!important;border-radius:11px!important}
  html[data-theme="dark"] .site-header .brand img{width:120px!important;height:42px!important}
}


/* ===== Source style block 11: clean4u-v540-dark-polish ===== */

/* ===== V5.41 — compact logo gradient + correct local logo + dark header edge fix ===== */

/*
  Header concept:
  In light mode the existing frosted header remains unchanged. In dark mode a
  full-height pale pistachio surface starts at the LEFT EDGE of the viewport,
  comfortably covers the logo, then dissolves into the normal dark header.
  The fade begins immediately after the visible logo artwork and finishes quickly,
  well before navigation text. Tablet/mobile use tighter geometry.
*/
.site-header{
  /* Visible logo is ~91px wide at the current 58px height. Start the fade
     immediately after the actual artwork, not after the 150px image box. */
  --clean4u-logo-zone-end:calc(max(20px,(100vw - 1160px)/2) + 96px);
  --clean4u-logo-zone-fade:clamp(56px,4vw,72px);
  isolation:isolate!important;
  overflow:visible!important;
  transition:
    background-color .52s ease,
    border-color .52s ease,
    box-shadow .52s ease!important;
}

.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(
    90deg,
    rgba(248,253,250,.998) 0,
    rgba(247,253,249,.998) var(--clean4u-logo-zone-end),
    rgba(225,243,233,.92) calc(var(--clean4u-logo-zone-end) + 12px),
    rgba(132,181,155,.54) calc(var(--clean4u-logo-zone-end) + 30px),
    rgba(39,78,60,.64) calc(var(--clean4u-logo-zone-end) + 48px),
    rgba(7,17,14,.96) calc(var(--clean4u-logo-zone-end) + var(--clean4u-logo-zone-fade)),
    rgba(7,17,14,.96) 100%
  );
  transition:opacity .58s cubic-bezier(.2,.8,.2,1)!important;
}

.site-header .nav-wrap{
  position:relative!important;
  z-index:1!important;
}

html[data-theme="dark"] .site-header{
  /* The pseudo-layer does the visual darkening. Keeping the light glass below
     it makes the mode switch a true cross-fade instead of a sudden background swap. */
  background:#07110e!important;
  border-bottom-color:rgba(60,105,85,.18)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.08)!important;
}
html[data-theme="dark"] .site-header::before{opacity:1!important}

/* No card/plate around the logo anymore: the header itself is its light stage. */
html[data-theme="dark"] .site-header .brand{
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:14px!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html[data-theme="dark"] .site-header .brand img{
  width:150px!important;
  height:58px!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

@media (min-width:641px) and (max-width:1200px){
  .site-header{
    --clean4u-logo-zone-end:calc(20px + 96px);
    --clean4u-logo-zone-fade:60px;
  }
}
@media (max-width:640px){
  .site-header{
    --clean4u-logo-zone-end:calc(14px + 82px);
    --clean4u-logo-zone-fade:52px;
  }
  html[data-theme="dark"] .site-header .brand img{
    width:128px!important;
    height:50px!important;
  }
}

/*
  Fix for “Strălucim din 2008”. V5.39 used the `background` shorthand in dark
  mode, which reset background-clip and painted a rectangle. Re-apply clipping
  AFTER the gradient declaration so only the glyphs receive the colour.
*/
html[data-theme="dark"] .hero-eyebrow-shine{
  background:none!important;
  position:relative!important;
  z-index:2!important;
}
html[data-theme="dark"] .hero-eyebrow-shine .hero-eyebrow-text{
  background:linear-gradient(
    112deg,
    #45c187 0%,
    #70d9a7 30%,
    #a9efcb 50%,
    #6bd5a1 68%,
    #41bb81 100%
  )!important;
  background-size:220% 100%!important;
  background-repeat:no-repeat!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 2px 7px rgba(43,169,111,.18))!important;
}
html[data-theme="dark"] .hero-eyebrow-shine .hero-eyebrow-glass{
  z-index:3!important;
}

/*
  One continuous dark canvas from the visit form through Contact and Careers.
  This mirrors the seamless lower area already perceived in light mode.
*/
html[data-theme="dark"] #vizionare.section,
html[data-theme="dark"] #contact.section,
html[data-theme="dark"] .careers-section{
  background:#0b1b15!important;
  background-image:none!important;
}

/* The previous spacer was a margin, exposing the darker BODY behind it.
   Turn it into internal padding so the same canvas fills the gap. */
html[data-theme="dark"] .careers-section{
  margin-top:0!important;
  padding-top:12px!important;
}

/* Keep depth consistent from one lower card to the next. */
html[data-theme="dark"] .visit-form,
html[data-theme="dark"] .contact-panel{
  box-shadow:
    0 18px 46px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.018)!important;
}
/* Match the light-mode Careers architecture: one clipped side/bottom shadow only.
   The earlier dark rule added a second full shadow, which could create a band. */
html[data-theme="dark"] .careers-card{
  box-shadow:none!important;
}
html[data-theme="dark"] .careers-card::after{
  box-shadow:0 18px 46px rgba(0,0,0,.20)!important;
}

@media(max-width:980px){
  html[data-theme="dark"] .careers-section{padding-top:10px!important}
}
@media(max-width:640px){
  html[data-theme="dark"] .careers-section{padding-top:8px!important}
}

@media(prefers-reduced-motion:reduce){
  .site-header,
  .site-header::before{transition:none!important}
}


/* ===== Source style block 12: clean4u-v541-header-fix ===== */

/* ===== V5.41 — shorter dark header gradient + cache-safe corrected logo ===== */
.site-header{
  --clean4u-logo-zone-end:calc(max(20px,(100vw - 1160px)/2) + 96px);
  --clean4u-logo-zone-fade:34px;
}
.site-header::before{
  background:linear-gradient(
    90deg,
    rgba(248,253,250,.998) 0,
    rgba(247,253,249,.998) var(--clean4u-logo-zone-end),
    rgba(218,240,229,.88) calc(var(--clean4u-logo-zone-end) + 8px),
    rgba(89,132,111,.48) calc(var(--clean4u-logo-zone-end) + 19px),
    rgba(7,17,14,.96) calc(var(--clean4u-logo-zone-end) + var(--clean4u-logo-zone-fade)),
    rgba(7,17,14,.96) 100%
  )!important;
}
html[data-theme="dark"] .site-header{
  border-bottom-color:transparent!important;
}
html[data-theme="dark"] .site-header::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:rgba(20,72,52,.34);
  pointer-events:none;
  z-index:2;
}
@media (min-width:641px) and (max-width:1200px){
  .site-header{
    --clean4u-logo-zone-end:calc(20px + 96px);
    --clean4u-logo-zone-fade:30px;
  }
}
@media (max-width:640px){
  .site-header{
    --clean4u-logo-zone-end:calc(14px + 82px);
    --clean4u-logo-zone-fade:26px;
  }
}


/* ===== Source style block 13: clean4u-v542-header-fluid-gradient ===== */

/* ===== V5.42 — logo-aware dark header gradient + clean theme cross-fade ===== */
.site-header{
  /* JS replaces this with the real right edge of the visible logo artwork. */
  --clean4u-logo-art-right:calc(max(20px,(100vw - 1160px)/2) + 94px);
  --clean4u-header-fade:clamp(104px,6.2vw,132px);

  /* Keep the physical header canvas LIGHT in both themes. Dark mode is painted
     by ::before. This prevents the pale logo zone from briefly turning grey/black
     while the dark overlay fades away. */
  background:rgba(247,250,248,.90)!important;
  border-bottom-color:rgba(223,232,227,.75)!important;
}

html[data-theme="dark"] .site-header{
  background:rgba(247,250,248,.90)!important;
  border-bottom-color:transparent!important;
}

.site-header::before{
  opacity:0!important;
  background:linear-gradient(
    90deg,
    #f8fdfa 0,
    #f8fdfa var(--clean4u-logo-art-right),
    #f3fbf7 calc(var(--clean4u-logo-art-right) + 14px),
    #e6f4ec calc(var(--clean4u-logo-art-right) + 32px),
    #c9dfd3 calc(var(--clean4u-logo-art-right) + 52px),
    #91ad9f calc(var(--clean4u-logo-art-right) + 73px),
    #526d60 calc(var(--clean4u-logo-art-right) + 92px),
    #274137 calc(var(--clean4u-logo-art-right) + 108px),
    #10231c calc(var(--clean4u-logo-art-right) + 120px),
    #07110e calc(var(--clean4u-logo-art-right) + var(--clean4u-header-fade)),
    #07110e 100%
  )!important;
  transition:opacity .62s cubic-bezier(.22,.8,.24,1)!important;
}
html[data-theme="dark"] .site-header::before{opacity:1!important}

/* The separator participates in the same smooth theme change instead of being
   inserted/removed in one frame. */
.site-header::after{
  content:""!important;
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:rgba(20,72,52,.34);
  opacity:0;
  pointer-events:none;
  z-index:2;
  transition:opacity .45s ease!important;
}
html[data-theme="dark"] .site-header::after{opacity:1!important}

/* Correct wide-desktop fallback before JS performs its exact measurement. */
@media(min-width:1321px){
  .site-header{
    --clean4u-logo-art-right:calc(max(12px,(100vw - 1540px)/2) + 94px);
    --clean4u-header-fade:clamp(112px,6.4vw,138px);
  }
}
@media (min-width:641px) and (max-width:1320px){
  .site-header{--clean4u-header-fade:104px}
}
@media(max-width:640px){
  .site-header{
    --clean4u-logo-art-right:104px;
    --clean4u-header-fade:78px;
  }
}

@media(prefers-reduced-motion:reduce){
  .site-header::before,.site-header::after{transition:none!important}
}


/* ===== Source style block 14: clean4u-v546-header-gradient-twelve-stage ===== */

/* ===== V5.46 — 12-stage perceptual header gradient (4 light + 8 dark) ===== */
.site-header{
  --clean4u-grad-start:190px;
  --clean4u-grad-1:212px;
  --clean4u-grad-2:234px;
  --clean4u-grad-3:255px;
  --clean4u-grad-4:277px;
  --clean4u-grad-5:299px;
  --clean4u-grad-6:321px;
  --clean4u-grad-7:342px;
  --clean4u-grad-8:364px;
  --clean4u-grad-9:386px;
  --clean4u-grad-10:408px;
  --clean4u-grad-11:429px;
  --clean4u-grad-end:451px;
  background:rgba(247,250,248,.90)!important;
  border-bottom:0!important;
}

/*
  12 equal physical segments:
  1–4  : white -> very pale green -> pistachio
  5–12 : pistachio -> progressively deeper greens -> final dark header green
  Colours are interpolated perceptually so no part of the fade collapses
  suddenly into the final dark tone.
*/
.site-header::before{
  background:linear-gradient(
    90deg,
    #f8fdfa 0,
    #f8fdfa var(--clean4u-grad-start),
    #e8f6ed var(--clean4u-grad-1),
    #d8f0e0 var(--clean4u-grad-2),
    #c8e9d3 var(--clean4u-grad-3),
    #b8e2c6 var(--clean4u-grad-4),
    #9fc4ac var(--clean4u-grad-5),
    #86a792 var(--clean4u-grad-6),
    #6e8b7a var(--clean4u-grad-7),
    #577062 var(--clean4u-grad-8),
    #41564b var(--clean4u-grad-9),
    #2c3d35 var(--clean4u-grad-10),
    #192621 var(--clean4u-grad-11),
    #07110e var(--clean4u-grad-end),
    #07110e 100%
  )!important;
  opacity:0!important;
  transition:opacity .62s cubic-bezier(.22,.8,.24,1)!important;
}
html[data-theme="dark"] .site-header::before{opacity:1!important}

.site-header::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;right:0!important;bottom:0!important;
  height:1px!important;
  background:rgba(223,232,227,.75)!important;
  opacity:1!important;
  pointer-events:none!important;
  z-index:2!important;
  transition:opacity .42s ease!important;
}
html[data-theme="dark"] .site-header::after{opacity:0!important}

@media(prefers-reduced-motion:reduce){
  .site-header::before,.site-header::after{transition:none!important}
}


/* ===== Source style block 15: clean4u-v549-theme-header-stability ===== */

/* ===== V5.49 — truly static header text during light/dark switching ===== */

/* Older experiments assigned the desktop nav its own View Transition snapshot.
   Disable that completely: theme changes now happen on the live DOM. */
.site-header .main-nav{
  view-transition-name:none!important;
}
.site-header .main-nav > a:not(.btn){
  view-transition-name:none!important;
}

/* Keep glyph metrics/rasterisation stable while only the colour changes. */
@media(min-width:981px){
  .site-header .main-nav > a:not(.btn){
    line-height:1.2!important;
    font-synthesis:none!important;
    text-rendering:geometricPrecision;
    -webkit-font-smoothing:antialiased;
  }

  html.clean4u-theme-switching .site-header .main-nav > a:not(.btn){
    /* No geometry property is allowed to participate in the theme switch. */
    transition-property:color!important;
    transition-duration:.34s!important;
    transition-timing-function:ease!important;
  }

  html.clean4u-theme-switching .site-header .main-nav > a:not(.btn)::after{
    /* The hover underline keeps its current state; it does not reanimate just
       because the colour theme changed. */
    transition:none!important;
  }
}

/* Neutralise the old named-nav snapshot rules even on browsers that keep a
   previous transition object alive for one frame. */
::view-transition-group(c4u-main-nav),
::view-transition-image-pair(c4u-main-nav),
::view-transition-old(c4u-main-nav),
::view-transition-new(c4u-main-nav){
  animation:none!important;
  transform:none!important;
}
::view-transition-old(c4u-main-nav){opacity:0!important}
::view-transition-new(c4u-main-nav){opacity:1!important}

@media(prefers-reduced-motion:reduce){
  html.clean4u-theme-switching .site-header .main-nav > a:not(.btn){transition:none!important}
}


/* ===== Source style block 16: clean4u-v550-hard-static-nav ===== */

/* ===== V5.50 — hard-lock desktop nav geometry during theme changes ===== */
@media(min-width:981px){
  /*
    The plain navigation labels must never be promoted to independent GPU
    layers. Older rules used translate3d()/will-change, which can make glyphs
    rerasterize a fraction of a pixel differently when their colour changes.
  */
  .site-header .main-nav > a:not(.btn){
    width:var(--c4u-nav-lock-width,auto)!important;
    min-width:var(--c4u-nav-lock-width,0)!important;
    max-width:var(--c4u-nav-lock-width,none)!important;
    flex-basis:var(--c4u-nav-lock-width,auto)!important;
    transform:none!important;
    will-change:auto!important;
    backface-visibility:visible!important;
    -webkit-backface-visibility:visible!important;
    text-rendering:auto!important;
    -webkit-font-smoothing:antialiased!important;
  }

  .site-header .main-nav > a:not(.btn):hover,
  .site-header .main-nav > a:not(.btn):active{
    transform:none!important;
  }

  /* Theme switching is colour-only and instantaneous for these glyphs.
     The header/gradient/icon keep their own smooth transitions. */
  html.clean4u-theme-switching .site-header .main-nav > a:not(.btn){
    transition:none!important;
  }
}


/* ===== Source style block 17: clean4u-v555-mobile-header-controls ===== */

/* ===== V5.55 — mobile header: static theme toggle + exactly symmetric control gaps ===== */
@media(max-width:640px){
  .site-header .nav-wrap{
    --c4u-mobile-control-gap:10px;
    gap:0!important;
  }

  .site-header .mobile-lang-dropdown{
    order:2!important;
    margin-left:auto!important;
    margin-right:var(--c4u-mobile-control-gap)!important;
    flex:0 0 auto!important;
  }

  .site-header .theme-toggle-mobile{
    order:3!important;
    display:inline-grid!important;
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    margin:0 var(--c4u-mobile-control-gap) 0 0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  .site-header .menu-toggle{
    order:4!important;
    margin:0!important;
    flex:0 0 auto!important;
  }

  /* Language changes must never fade, translate or otherwise disturb the
     mobile theme control. Its geometry stays identical from first to last frame. */
  html.clean4u-language-changing .site-header .theme-toggle-mobile,
  .site-header .theme-toggle-mobile.clean4u-language-theme-hidden{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
    animation:none!important;
  }
}

/* Keep all three controls even on very narrow phones instead of hiding theme. */
@media(max-width:360px){
  .site-header .nav-wrap{--c4u-mobile-control-gap:7px}
  .site-header .brand img{width:106px!important;height:46px!important}
  .site-header .mobile-lang-trigger{
    min-width:72px!important;
    height:38px!important;
    padding:0 8px!important;
    gap:5px!important;
  }
  .site-header .theme-toggle-mobile{
    display:inline-grid!important;
    flex-basis:36px!important;
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
  }
  .site-header .theme-toggle-desktop{display:none!important}
}


/* ===== Source style block 18: clean4u-v556-header-language-polish ===== */

/* ===== V5.56 — unified header language choreography ===== */

/* The language trigger keeps an absolutely stable internal grid. Reusing the
   same IMG node + fixed boxes prevents the flag/code from nudging the pill. */
.site-header .mobile-lang-trigger .lang-trigger-flag{
  flex:0 0 24px!important;
  width:24px!important;
  min-width:24px!important;
  height:18px!important;
  overflow:hidden!important;
}
.site-header .mobile-lang-trigger .lang-trigger-code{
  display:inline-block!important;
  flex:0 0 22px!important;
  width:22px!important;
  min-width:22px!important;
  text-align:center!important;
  line-height:1!important;
}
.site-header .mobile-lang-trigger .lang-flag-img{
  width:24px!important;
  height:18px!important;
  max-width:none!important;
}

/* While a language is changing, WAAPI owns the opacity. No inherited hover,
   transform or GPU-layer transition is allowed to compete with it. */
html.clean4u-header-language-changing .site-header .main-nav,
html.clean4u-header-language-changing .site-header .mobile-lang-dropdown,
html.clean4u-header-language-changing .site-header .mobile-lang-trigger,
html.clean4u-header-language-changing .site-header .lang-trigger-flag,
html.clean4u-header-language-changing .site-header .lang-trigger-code,
html.clean4u-header-language-changing .site-header .lang-flag-img{
  transform:none!important;
  translate:none!important;
  scale:none!important;
}
html.clean4u-header-language-changing .site-header .lang-flag-img{
  transition:none!important;
  will-change:auto!important;
}

/* Phone + tablet/iPad use the compact header. Theme and hamburger are anchors:
   language changes must never fade, move or resize the theme control. */
@media(max-width:1320px){
  html.clean4u-language-changing .site-header .theme-toggle-mobile,
  html.clean4u-header-language-changing .site-header .theme-toggle-mobile,
  .site-header .theme-toggle-mobile.clean4u-language-theme-hidden{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
    animation:none!important;
    will-change:auto!important;
  }
}

/* iPad/tablet: the complete language pill owns the fade. Its internal SVG,
   code and chevron are frozen while hidden so WebKit cannot repaint them in
   separate steps. */
@media(min-width:641px) and (max-width:1320px){
  html.clean4u-header-language-changing .site-header .mobile-lang-trigger *,
  html.clean4u-header-language-changing .site-header .mobile-lang-trigger .lang-flag-img{
    transition:none!important;
    animation:none!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
    will-change:auto!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html.clean4u-header-language-changing .site-header *{
    animation:none!important;
  }
}


/* ===== Source style block 19: clean4u-v558-header-language-transaction ===== */

/* ===== V5.58 — atomic header language transaction ===== */
@media(min-width:1321px){
  .site-header.clean4u-header-tight-fit .container.nav-wrap{
    --c4u-header-gap:8px!important;
    --c4u-header-control-gap:12px!important;
  }
}


/* ===== Source style block 20: clean4u-v566-footer-legal-links ===== */

.footer-legal-links{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;color:#93a69d;opacity:.9}
.footer-legal-links a{color:#aebfb7;text-decoration:none;border-bottom:1px solid rgba(174,191,183,.36);transition:color .2s ease,border-color .2s ease}
.footer-legal-links a:hover,.footer-legal-links a:focus-visible{color:#fff;border-color:rgba(255,255,255,.72)}
.footer-privacy-pending{color:#93a69d}
@media(max-width:640px){.footer-legal-links{justify-content:flex-start}}


/* ===== Source style block 21: clean4u-v567-policy-header-menu ===== */

/* ===== V5.67 — legal/policy access without disturbing the tuned header ===== */
.header-policy-dropdown{display:none}
.mobile-policy-links{display:none}

@media(min-width:1321px){
  .header-policy-dropdown{
    order:4!important;
    position:relative;
    display:flex;
    align-items:center;
    flex:0 0 38px;
    width:38px;
    height:38px;
    margin-left:10px;
    z-index:420;
  }
  .header-policy-trigger{
    width:38px;height:38px;padding:0;border-radius:50%;
    border:1px solid rgba(20,83,63,.18);
    background:rgba(255,255,255,.88);
    color:#236d52;
    display:grid;place-items:center;
    cursor:pointer;
    appearance:none;-webkit-appearance:none;
    -webkit-tap-highlight-color:transparent;
    -webkit-touch-callout:none;user-select:none;-webkit-user-select:none;
    box-shadow:0 5px 16px rgba(8,39,31,.055);
    transition:background .24s ease,border-color .24s ease,color .24s ease,box-shadow .24s ease,transform .20s ease;
  }
  .header-policy-trigger:hover,
  .header-policy-trigger[aria-expanded="true"]{
    background:#f4faf7;border-color:rgba(20,83,63,.28);color:#155e46;
    box-shadow:0 8px 22px rgba(8,39,31,.09);
  }
  .header-policy-trigger:active{transform:scale(.95)}
  .header-policy-trigger:focus-visible{outline:2px solid rgba(22,132,94,.27);outline-offset:3px}
  .header-policy-icon{width:21px;height:21px;overflow:visible}
  .policy-icon-ring,.policy-icon-stem,.policy-icon-x{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transform-origin:12px 12px}
  .policy-icon-dot{fill:currentColor;transform-origin:12px 12px}
  .policy-icon-ring,.policy-icon-dot,.policy-icon-stem,.policy-icon-x{transition:opacity .20s ease,transform .32s cubic-bezier(.16,1,.3,1)}
  .policy-icon-x{opacity:0;transform:scale(.42) rotate(-25deg)}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-ring{opacity:.18;transform:scale(.82) rotate(30deg)}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-dot{opacity:0;transform:scale(.2)}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-stem{opacity:0;transform:scaleY(.25) rotate(45deg)}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-x{opacity:1;transform:scale(1) rotate(0)}

  .header-policy-menu{
    position:absolute;right:0;top:calc(100% + 11px);
    width:min(310px,calc(100vw - 28px));
    padding:9px;
    border:1px solid rgba(20,83,63,.13);
    border-radius:18px;
    background:rgba(255,255,255,.985);
    box-shadow:0 22px 55px rgba(7,48,35,.16);
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(-8px) scale(.975);
    transform-origin:top right;
    transition:opacity .22s ease,transform .32s cubic-bezier(.16,1,.3,1),visibility 0s linear .32s,background .28s ease,border-color .28s ease;
  }
  .header-policy-menu[hidden]{display:none}
  .header-policy-menu.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);transition:opacity .22s ease,transform .32s cubic-bezier(.16,1,.3,1),visibility 0s linear 0s,background .28s ease,border-color .28s ease}
  .header-policy-menu-title{padding:7px 10px 9px;color:#72837b;font-size:10.5px;font-weight:900;letter-spacing:.075em;text-transform:uppercase}
  .header-policy-item{
    width:100%;min-height:48px;padding:9px 10px;border:0;border-radius:13px;background:transparent;color:#23372f;
    display:grid;grid-template-columns:31px 1fr;align-items:center;gap:10px;text-align:left;text-decoration:none;font:inherit;
    cursor:pointer;-webkit-tap-highlight-color:transparent;
    transition:background .18s ease,color .18s ease,transform .18s ease;
  }
  .header-policy-item:hover,.header-policy-item:focus-visible{background:#eef8f3;color:#14533f;outline:none}
  .header-policy-item:active{transform:scale(.988)}
  .header-policy-item-icon{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;background:#e6f4ed;color:#1f6b4f;font-size:11px;font-weight:950}
  .header-policy-item>span:last-child{font-size:13px;font-weight:850;line-height:1.25}
  .header-policy-item small{display:block;margin-top:3px;color:#87978f;font-size:10px;font-weight:750}
  .header-policy-item-pending{cursor:default!important;opacity:.72}
  .header-policy-item-pending:hover{background:transparent;color:#23372f}
}

@media(max-width:1320px){
  .header-policy-dropdown{display:none!important}
  .site-header .main-nav{max-height:calc(100dvh - 94px);overflow-y:auto;overscroll-behavior:contain}
  .mobile-policy-links{
    width:100%;display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:2px 0 0;
    opacity:0;transform:translateY(-6px);
    transition:opacity .24s ease,transform .32s cubic-bezier(.16,1,.3,1);
  }
  .site-header .main-nav.open .mobile-policy-links{opacity:1;transform:translateY(0);transition-delay:.19s,.19s}
  .mobile-policy-link{
    min-height:43px;padding:9px 12px;border:1px solid rgba(20,83,63,.14);border-radius:14px;
    background:rgba(230,244,237,.72);color:#205a45;
    display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;
    font:inherit;font-size:11.5px;font-weight:850;line-height:1.25;
    cursor:pointer;appearance:none;-webkit-appearance:none;
    -webkit-tap-highlight-color:transparent!important;-webkit-touch-callout:none!important;
    user-select:none!important;-webkit-user-select:none!important;
    transition:background .18s ease,border-color .18s ease,transform .18s ease,color .18s ease;
  }
  .mobile-policy-link:active{transform:scale(.985);background:#deefe6}
  .mobile-policy-link:focus-visible{outline:2px solid rgba(22,132,94,.25);outline-offset:2px}
  .mobile-policy-link-pending{flex-direction:column;gap:2px;cursor:default!important;opacity:.72}
  .mobile-policy-link-pending .policy-ui-pending{font-size:9.5px;color:#73877d;font-weight:750}
  .mobile-policy-link::selection,.mobile-policy-link *::selection{background:transparent;color:inherit}
}
@media(max-width:520px){.mobile-policy-links{grid-template-columns:1fr}}

html[data-theme="dark"] .header-policy-trigger{background:rgba(13,34,27,.93);border-color:rgba(180,222,203,.14);color:#b7ddca;box-shadow:0 5px 18px rgba(0,0,0,.15)}
html[data-theme="dark"] .header-policy-trigger:hover,html[data-theme="dark"] .header-policy-trigger[aria-expanded="true"]{background:#112a21;border-color:rgba(180,222,203,.22);color:#d8eee3}
html[data-theme="dark"] .header-policy-menu{background:rgba(9,27,21,.99);border-color:rgba(177,220,200,.10);box-shadow:0 22px 55px rgba(0,0,0,.32)}
html[data-theme="dark"] .header-policy-menu-title{color:#829b8f}
html[data-theme="dark"] .header-policy-item{color:#d1e6dc}
html[data-theme="dark"] .header-policy-item:hover,html[data-theme="dark"] .header-policy-item:focus-visible{background:#10291f;color:#e5f3ec}
html[data-theme="dark"] .header-policy-item-icon{background:#123126;color:#a9d8c2}
html[data-theme="dark"] .header-policy-item small{color:#7f9a8d}
html[data-theme="dark"] .header-policy-item-pending:hover{background:transparent;color:#d1e6dc}
html[data-theme="dark"] .mobile-policy-link{background:rgba(19,54,42,.72);border-color:rgba(174,220,199,.12);color:#c6e3d5}
html[data-theme="dark"] .mobile-policy-link:active{background:#15392c}
html[data-theme="dark"] .mobile-policy-link-pending .policy-ui-pending{color:#82998e}

@media(prefers-reduced-motion:reduce){
  .header-policy-trigger,.header-policy-trigger *,
  .header-policy-menu,.mobile-policy-links,.mobile-policy-link{transition:none!important;animation:none!important}
}


/* ===== Source style block 22: clean4u-v568-menu-polish ===== */

/* ===== V5.68 — coordinated header menus, cleaner icon morph, compact menu polish ===== */

/* The language list needs a little breathing room between interactive rows. */
.mobile-lang-menu{
  top:calc(100% + 28px)!important;
  display:grid;
  gap:4px;
}
.mobile-lang-menu[hidden]{display:none!important}
.mobile-lang-option{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
.mobile-lang-option::selection,.mobile-lang-option *::selection{background:transparent!important;color:inherit!important}

/* Desktop legal menu: start below the header surface instead of overlapping it. */
@media(min-width:1321px){
  .header-policy-menu{top:calc(100% + 28px)!important}

  /* The whole information glyph disappears into one larger X. */
  .header-policy-icon{width:22px!important;height:22px!important}
  .policy-icon-ring{
    stroke-width:1.85!important;
    transition:opacity .18s ease,transform .34s cubic-bezier(.16,1,.3,1),stroke-dashoffset .34s cubic-bezier(.16,1,.3,1)!important;
    stroke-dasharray:56!important;
    stroke-dashoffset:0;
  }
  .policy-icon-dot,.policy-icon-stem{
    transition:opacity .15s ease,transform .24s cubic-bezier(.16,1,.3,1)!important;
  }
  .policy-icon-x{
    stroke-width:2.15!important;
    opacity:0!important;
    transform:scale(.28) rotate(-42deg)!important;
    transition:opacity .16s ease .04s,transform .34s cubic-bezier(.16,1,.3,1)!important;
  }
  .header-policy-trigger[aria-expanded="true"]{
    background:transparent!important;
    border-color:transparent!important;
    box-shadow:none!important;
  }
  .header-policy-trigger[aria-expanded="true"] .policy-icon-ring{
    opacity:0!important;
    transform:scale(.22) rotate(82deg)!important;
    stroke-dashoffset:56!important;
  }
  .header-policy-trigger[aria-expanded="true"] .policy-icon-dot{opacity:0!important;transform:scale(.05)!important}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-stem{opacity:0!important;transform:scaleY(.08) rotate(45deg)!important}
  .header-policy-trigger[aria-expanded="true"] .policy-icon-x{
    opacity:1!important;
    transform:scale(1.17) rotate(0deg)!important;
  }

  /* Policy rows are textual actions; no decorative C/P badges. */
  .header-policy-item{grid-template-columns:1fr!important;gap:0!important;padding:11px 12px!important}
  .header-policy-item>span:last-child{width:100%}
}

/* Hamburger: three exactly equal strokes, including compact desktop/windowed mode. */
@media(max-width:1320px){
  .site-header .menu-toggle span{
    width:24px!important;min-width:24px!important;max-width:24px!important;
    margin:5px auto!important;
  }
}

/* On desktop widths that intentionally collapse to hamburger, every bubble uses the full menu width. */
@media(min-width:981px) and (max-width:1320px){
  .site-header .main-nav{align-items:stretch!important}
  .site-header .main-nav > a:not(.btn){
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    justify-content:flex-start!important;
  }
  .site-header .mobile-policy-links{
    grid-template-columns:1fr!important;
    width:auto!important;
    align-self:stretch!important;
    gap:9px!important;
  }
  .site-header .mobile-policy-link{width:100%!important;min-width:0!important;padding:11px 14px!important}
}

/* No native blue tap/selection flash on the legal/contact utility links. */
a[href^="mailto:"],
.location-osm-attribution,
.header-policy-trigger,
.header-policy-item,
.mobile-policy-link{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
}
.location-osm-attribution{user-select:none!important;-webkit-user-select:none!important;touch-action:manipulation}
a[href^="mailto:"]::selection,.location-osm-attribution::selection,.location-osm-attribution *::selection{background:transparent!important;color:inherit!important}

@media(prefers-reduced-motion:reduce){
  .policy-icon-ring,.policy-icon-dot,.policy-icon-stem,.policy-icon-x{transition:none!important}
}


/* ===== Source style block 23: clean4u-v569-control-geometry-and-crispness ===== */

/* ===== V5.69 — crisp policy glyph + exactly matched header control geometry ===== */

/* The information glyph is pure vector geometry with integer-aligned strokes.
   This keeps it as crisp as the X it morphs into on Chromium/Windows scaling. */
.header-policy-icon{
  width:22px!important;
  height:22px!important;
  display:block!important;
  overflow:visible!important;
  shape-rendering:geometricPrecision;
}
.policy-icon-ring,
.policy-icon-dot,
.policy-icon-stem,
.policy-icon-x{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.policy-icon-dot{stroke-width:2.35!important}
.policy-icon-x{stroke-width:2.15!important}

/* Desktop: language pill is 42px high, therefore both circular utility
   controls are exactly 42px in diameter as well. */
@media(min-width:1321px){
  .site-header .theme-toggle-desktop,
  .site-header .header-policy-dropdown,
  .site-header .header-policy-trigger{
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
  }
  .site-header .theme-toggle-desktop,
  .site-header .header-policy-dropdown{
    flex:0 0 42px!important;
  }
  .site-header .header-policy-trigger{border-radius:50%!important}

  /* Preserve the exact same geometry during the atomic language transition. */
  html.clean4u-language-changing .site-header .theme-toggle-desktop,
  html.clean4u-header-language-changing .site-header .theme-toggle-desktop{
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
  }
}

/* Compact header: the theme circle always matches the visible language pill. */
@media(min-width:981px) and (max-width:1320px){
  .site-header .theme-toggle-mobile{
    flex:0 0 42px!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
  }
}
@media(min-width:641px) and (max-width:980px){
  .site-header .theme-toggle-mobile{
    flex:0 0 40px!important;
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
  }
}
@media(max-width:640px){
  .site-header .theme-toggle-mobile{
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:38px!important;
  }
}

/* Hamburger: every closed-state bar is an identical 24x2px raster surface.
   Explicitly reset transform/opacity after the close animation so the third
   bar can never remain on a fractional transformed layer. */
@media(max-width:1320px){
  .site-header .menu-toggle span{
    display:block!important;
    box-sizing:border-box!important;
    width:24px!important;
    min-width:24px!important;
    max-width:24px!important;
    height:2px!important;
    min-height:2px!important;
    max-height:2px!important;
    margin:5px auto!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    opacity:1;
    filter:none!important;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
  }
  .site-header .menu-toggle:not([aria-expanded="true"]) span{
    opacity:1!important;
    transform:translate3d(0,0,0)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(1){
    opacity:1!important;
    transform:translateY(7px) rotate(45deg)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(2){
    opacity:0!important;
    transform:scaleX(.35)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(3){
    opacity:1!important;
    transform:translateY(-7px) rotate(-45deg)!important;
  }
}


/* ===== Source style block 24: clean4u-v572-header-first-paint-repair ===== */

/* ===== V5.72 — keep the exact v5.69 information icon; retain only the proven first-frame hamburger repair ===== */

/* HAMBURGER
   Keep the original three-span markup and original responsive visibility rules.
   Only place the bars on fixed integer rows and remove the closed-state 3D transform
   that could leave the third bar on a different raster phase before the first click. */
@media(max-width:1320px){
  .site-header .menu-toggle{
    position:relative!important;
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    padding:0!important;
    line-height:0!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .site-header .menu-toggle span{
    position:absolute!important;
    left:50%!important;
    display:block!important;
    box-sizing:border-box!important;
    width:24px!important;
    min-width:24px!important;
    max-width:24px!important;
    height:2px!important;
    min-height:2px!important;
    max-height:2px!important;
    margin:0 0 0 -12px!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    background:var(--ink)!important;
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    transform-origin:12px 1px!important;
    backface-visibility:visible!important;
    -webkit-backface-visibility:visible!important;
    will-change:auto!important;
    transition:transform .30s cubic-bezier(.16,1,.3,1),opacity .18s ease!important;
  }
  .site-header .menu-toggle span:nth-child(1){top:11px!important}
  .site-header .menu-toggle span:nth-child(2){top:19px!important}
  .site-header .menu-toggle span:nth-child(3){top:27px!important}
  .site-header .menu-toggle:not([aria-expanded="true"]) span{
    transform:none!important;
    opacity:1!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(1){
    transform:translateY(8px) rotate(45deg)!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(2){
    transform:scaleX(.35)!important;
    opacity:0!important;
  }
  .site-header .menu-toggle[aria-expanded="true"] span:nth-child(3){
    transform:translateY(-8px) rotate(-45deg)!important;
  }
  html[data-theme="dark"] .site-header .menu-toggle span{background:#e8f5ef!important}
}

@media(prefers-reduced-motion:reduce){
  .policy-icon-ring,.policy-icon-dot,.policy-icon-stem,.policy-icon-x,.site-header .menu-toggle span{
    transition:none!important;
  }
}


/* ===== Source style block 25: clean4u-v573-footer-touch-polish ===== */

/* v5.73 — footer links: no blue tap selection + one consistent smooth interaction */
.site-footer a{
  -webkit-tap-highlight-color:transparent!important;
  -webkit-touch-callout:none!important;
  -webkit-user-select:none!important;
  user-select:none!important;
  touch-action:manipulation;
}
.site-footer .footer-grid a,
.site-footer .footer-legal-links a{
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  transform:translate3d(0,0,0) scale(1);
  transform-origin:left center;
  transition:color .20s ease,border-color .20s ease,opacity .20s ease,transform .22s cubic-bezier(.2,.8,.2,1),filter .22s ease!important;
  will-change:transform;
}
@media (hover:hover) and (pointer:fine){
  .site-footer .footer-grid a:hover,
  .site-footer .footer-legal-links a:hover{
    transform:translate3d(0,-1px,0) scale(1.015);
    color:#fff!important;
  }
}
.site-footer .footer-grid a:active,
.site-footer .footer-legal-links a:active{
  transform:translate3d(0,1px,0) scale(.97)!important;
  opacity:.86;
  transition-duration:.10s!important;
}
.site-footer .footer-grid a:focus-visible,
.site-footer .footer-legal-links a:focus-visible{
  outline:2px solid rgba(111,206,160,.88);
  outline-offset:4px;
  border-radius:5px;
}
.site-footer .footer-grid a::selection,
.site-footer .footer-grid a *::selection,
.site-footer .footer-legal-links a::selection,
.site-footer .footer-legal-links a *::selection{
  background:transparent;
  color:inherit;
}


/* ===== Source style block 26: clean4u-v574-theme-canvas-transition ===== */

/* ===== V5.74 — smooth page-canvas light/dark interpolation =====
   The main page backgrounds now morph with the exact 0.62 s timing used by
   the approved header cross-fade. Registered colour properties allow even
   gradient backgrounds to interpolate instead of snapping between themes. */
@property --c4u-canvas-bg{syntax:"<color>";inherits:true;initial-value:#f5f6f4;}
@property --c4u-lower-bg{syntax:"<color>";inherits:true;initial-value:#f5f6f4;}
@property --c4u-hero-radial{syntax:"<color>";inherits:true;initial-value:rgba(45,139,99,.10);}
@property --c4u-hero-a{syntax:"<color>";inherits:true;initial-value:#fbfcfb;}
@property --c4u-hero-b{syntax:"<color>";inherits:true;initial-value:#f5f7f5;}
@property --c4u-hero-c{syntax:"<color>";inherits:true;initial-value:#ffffff;}
@property --c4u-hero-grid{syntax:"<color>";inherits:true;initial-value:rgba(20,83,63,.06);}
@property --c4u-soft-a{syntax:"<color>";inherits:true;initial-value:#eef1ef;}
@property --c4u-soft-b{syntax:"<color>";inherits:true;initial-value:#f4f5f3;}
@property --c4u-reserved-glow{syntax:"<color>";inherits:true;initial-value:rgba(63,171,120,.08);}
@property --c4u-reserved-a{syntax:"<color>";inherits:true;initial-value:#f4faf6;}
@property --c4u-reserved-b{syntax:"<color>";inherits:true;initial-value:#ffffff;}
@property --c4u-cookie-a{syntax:"<color>";inherits:true;initial-value:#f7fbf8;}
@property --c4u-cookie-b{syntax:"<color>";inherits:true;initial-value:#ffffff;}
@property --c4u-footer-bg{syntax:"<color>";inherits:true;initial-value:#071d17;}
@property --c4u-glow-1{syntax:"<color>";inherits:true;initial-value:#cfe7d8;}
@property --c4u-glow-2{syntax:"<color>";inherits:true;initial-value:#e3efe8;}

:root{
  --c4u-canvas-bg:#f5f6f4;
  --c4u-lower-bg:#f5f6f4;
  --c4u-hero-radial:rgba(45,139,99,.10);
  --c4u-hero-a:#fbfcfb;
  --c4u-hero-b:#f5f7f5;
  --c4u-hero-c:#ffffff;
  --c4u-hero-grid:rgba(20,83,63,.06);
  --c4u-soft-a:#eef1ef;
  --c4u-soft-b:#f4f5f3;
  --c4u-reserved-glow:rgba(63,171,120,.08);
  --c4u-reserved-a:#f4faf6;
  --c4u-reserved-b:#ffffff;
  --c4u-cookie-a:#f7fbf8;
  --c4u-cookie-b:#ffffff;
  --c4u-footer-bg:#071d17;
  --c4u-glow-1:#cfe7d8;
  --c4u-glow-2:#e3efe8;
}

html{
  transition:
    --c4u-canvas-bg .62s cubic-bezier(.22,.8,.24,1),
    --c4u-lower-bg .62s cubic-bezier(.22,.8,.24,1),
    --c4u-hero-radial .62s cubic-bezier(.22,.8,.24,1),
    --c4u-hero-a .62s cubic-bezier(.22,.8,.24,1),
    --c4u-hero-b .62s cubic-bezier(.22,.8,.24,1),
    --c4u-hero-c .62s cubic-bezier(.22,.8,.24,1),
    --c4u-hero-grid .62s cubic-bezier(.22,.8,.24,1),
    --c4u-soft-a .62s cubic-bezier(.22,.8,.24,1),
    --c4u-soft-b .62s cubic-bezier(.22,.8,.24,1),
    --c4u-reserved-glow .62s cubic-bezier(.22,.8,.24,1),
    --c4u-reserved-a .62s cubic-bezier(.22,.8,.24,1),
    --c4u-reserved-b .62s cubic-bezier(.22,.8,.24,1),
    --c4u-cookie-a .62s cubic-bezier(.22,.8,.24,1),
    --c4u-cookie-b .62s cubic-bezier(.22,.8,.24,1),
    --c4u-footer-bg .62s cubic-bezier(.22,.8,.24,1),
    --c4u-glow-1 .62s cubic-bezier(.22,.8,.24,1),
    --c4u-glow-2 .62s cubic-bezier(.22,.8,.24,1)!important;
}

html[data-theme="dark"]{
  --c4u-canvas-bg:#07110e;
  --c4u-lower-bg:#0b1b15;
  --c4u-hero-radial:rgba(18,63,47,.40);
  --c4u-hero-a:#07110e;
  --c4u-hero-b:#0a1a14;
  --c4u-hero-c:#08130f;
  --c4u-hero-grid:rgba(153,221,188,.055);
  --c4u-soft-a:#0a1813;
  --c4u-soft-b:#0d2119;
  --c4u-reserved-glow:rgba(63,171,120,.10);
  --c4u-reserved-a:#07110e;
  --c4u-reserved-b:#0b1a14;
  --c4u-cookie-a:#07110e;
  --c4u-cookie-b:#081712;
  --c4u-footer-bg:#04100c;
  --c4u-glow-1:#123f2f;
  --c4u-glow-2:#0d3326;
}

body{background-color:var(--c4u-canvas-bg)!important;}
.hero{
  background:
    radial-gradient(circle at 86% 14%,var(--c4u-hero-radial),transparent 28%),
    linear-gradient(135deg,var(--c4u-hero-a) 0%,var(--c4u-hero-b) 55%,var(--c4u-hero-c) 100%)!important;
}
.hero::after{
  background-image:
    linear-gradient(var(--c4u-hero-grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--c4u-hero-grid) 1px,transparent 1px)!important;
}
.hero-glow-1{background-color:var(--c4u-glow-1)!important;}
.hero-glow-2{background-color:var(--c4u-glow-2)!important;}
.section:not(.section-soft){background:var(--c4u-canvas-bg)!important;}
.section-soft{background:linear-gradient(180deg,var(--c4u-soft-a) 0%,var(--c4u-soft-b) 100%)!important;}
#vizionare.section,#contact.section,.careers-section{background:var(--c4u-lower-bg)!important;background-image:none!important;}
.reserved-page{
  background:
    radial-gradient(circle at 18% 12%,var(--c4u-reserved-glow),transparent 30%),
    linear-gradient(180deg,var(--c4u-reserved-a) 0%,var(--c4u-reserved-b) 72%)!important;
}
.cookie-policy-page{
  background:linear-gradient(180deg,var(--c4u-cookie-a) 0%,var(--c4u-cookie-b) 30%,var(--c4u-cookie-b) 100%)!important;
}
.site-footer{background-color:var(--c4u-footer-bg)!important;}

@media(prefers-reduced-motion:reduce){
  html{transition:none!important;}
}


/* ===== Source style block 27: clean4u-v576-reserved-theme-sync ===== */

/* V5.76 — reserved pages inherit the same approved 0.62 s theme timing. */
.reserved-page,.site-footer{transition:background-color .62s cubic-bezier(.22,.8,.24,1),border-color .62s cubic-bezier(.22,.8,.24,1),color .62s cubic-bezier(.22,.8,.24,1)!important;}
@media(prefers-reduced-motion:reduce){.reserved-page,.site-footer{transition:none!important;}}


/* ===== Source style block 28: clean4u-v579-header-policy-gap ===== */

/* ===== V5.79 — equal desktop control spacing ===== */
@media(min-width:1321px){
  .site-header .header-policy-dropdown{
    margin-left:var(--c4u-header-control-gap,14px)!important;
  }
}


/* ===== Source style block 29: clean4u-v633-portfolio-coming-soon ===== */

.reserved-page{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:clamp(72px,10vw,128px) 20px clamp(54px,7vw,88px);
}
.portfolio-coming-soon{
  width:min(680px,100%);
  margin:0 auto;
  text-align:center;
  padding:clamp(26px,4vw,38px);
  border:1px solid rgba(34,126,89,.16);
  border-radius:24px;
  background:rgba(255,255,255,.72);
  box-shadow:0 18px 58px rgba(8,39,31,.08),inset 0 1px 0 rgba(255,255,255,.84);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.portfolio-coming-soon-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 15px;
  border-radius:999px;
  background:rgba(41,144,101,.11);
  color:#1f7957;
  font-weight:800;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.portfolio-coming-soon p{
  margin:18px auto 0;
  max-width:560px;
  color:#53645c;
  font-size:clamp(15px,2vw,17px);
  line-height:1.7;
}
html[data-theme="dark"] .portfolio-coming-soon{
  background:rgba(9,27,20,.78);
  border-color:rgba(92,189,142,.18);
  box-shadow:0 20px 62px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"] .portfolio-coming-soon-badge{background:rgba(69,169,120,.15);color:#7bc7a1}
html[data-theme="dark"] .portfolio-coming-soon p{color:#a8bbb1}
@media(max-width:640px){
  .reserved-page{padding:56px 16px 42px}
  .portfolio-coming-soon{border-radius:20px;padding:24px 20px}
}
@media(prefers-reduced-motion:reduce){.portfolio-coming-soon{backdrop-filter:none;-webkit-backdrop-filter:none}}


/* ===== Source style block 30: clean4u-v636-footer-social ===== */

/* ===== V6.37 — dedicated Social Media footer column ===== */
@media(min-width:981px){.site-footer .footer-grid{grid-template-columns:1.08fr 1fr 1.14fr .86fr .92fr!important;gap:28px!important}}
.footer-social-zone{min-width:0}
.footer-social-link{display:inline-flex!important;align-items:center!important;gap:7px!important;width:max-content;max-width:100%;color:#aebfb7!important;text-decoration:none!important;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:color .2s ease,transform .2s ease!important}
.footer-social-link svg{width:14px!important;height:14px!important;flex:0 0 14px;transition:transform .2s ease,filter .2s ease!important}
.footer-social-link span{color:inherit!important;font-size:13px!important}
.footer-social-link:hover{color:#fff!important;transform:translateY(-1px)}
.footer-social-link:hover svg{transform:scale(1.08)}
.footer-facebook svg{fill:#1877f2!important;filter:drop-shadow(0 2px 4px rgba(24,119,242,.14))}
.footer-facebook:hover svg{filter:drop-shadow(0 3px 6px rgba(24,119,242,.22))}
.footer-instagram svg{fill:#e4405f;filter:drop-shadow(0 2px 4px rgba(228,64,95,.14))}
.footer-instagram:hover svg{filter:drop-shadow(0 3px 6px rgba(228,64,95,.22))}
@media(max-width:980px){.site-footer .footer-grid{gap:30px 34px!important}}
@media(max-width:640px){.site-footer .footer-grid{gap:26px!important}}


/* ===== Source style block 31: clean4u-v637-iphone-core ===== */

/* ===== V6.37 — iPhone/Safari core polish =====
   iOS Safari automatically zooms focused text controls below 16px. Keep the
   visual layout intact while ensuring every editable control meets that
   threshold on real iPhones only. */
html.clean4u-iphone input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html.clean4u-iphone textarea,
html.clean4u-iphone select{
  font-size:16px!important;
}

/* While the hamburger is mounted, the document itself must not pan/rubber-band
   behind the blurred scrim. The nav remains independently scrollable if a
   short iPhone viewport ever needs it. */
html.clean4u-iphone.clean4u-iphone-menu-locked,
html.clean4u-iphone.clean4u-iphone-menu-locked body{
  overscroll-behavior:none!important;
}
html.clean4u-iphone.clean4u-iphone-menu-locked .site-header .main-nav{
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
}


/* ===== Source style block 32: clean4u-v635-ipad-hamburger-scroll-lock ===== */

/* ===== V6.35 — iPad hamburger: hard page scroll lock =====
   Safari/iPad can still pan the document through a fixed scrim. While the
   hamburger is mounted (including its close animation), freeze the page at the
   exact current scroll position. The nav itself remains usable/scrollable. */
html.clean4u-ipad.clean4u-hamburger-scroll-locked,
html.clean4u-ipad.clean4u-hamburger-scroll-locked body{
  overscroll-behavior:none!important;
}
html.clean4u-ipad.clean4u-hamburger-scroll-locked .site-header .main-nav{
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch;
}

/* ===== V6.67 — hamburger scrim + stable viewport menu ===== */
.clean4u-hamburger-scrim{
  position:fixed;
  inset:0;
  z-index:1240;
  display:block;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:rgba(8,39,31,.10);
  -webkit-backdrop-filter:blur(7px) saturate(.96);
  backdrop-filter:blur(7px) saturate(.96);
  touch-action:none;
  overscroll-behavior:none;
  -webkit-user-select:none;
  user-select:none;
  transition:opacity .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear .30s;
}
.clean4u-hamburger-scrim.is-open,
.clean4u-hamburger-scrim.is-closing{
  visibility:visible;
  pointer-events:auto;
  transition:opacity .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear 0s;
}
.clean4u-hamburger-scrim.is-open{opacity:1}
.clean4u-hamburger-scrim.is-closing{opacity:0}
html[data-theme="dark"] .clean4u-hamburger-scrim{
  background:rgba(2,12,9,.24);
  -webkit-backdrop-filter:blur(7px) saturate(.88);
  backdrop-filter:blur(7px) saturate(.88);
}
html.clean4u-hamburger-open .site-header{z-index:1300!important}
@media(max-width:1320px){
  .site-header .main-nav.open,
  .site-header .main-nav.open.is-closing{
    position:fixed!important;
    top:92px!important;
    left:20px!important;
    right:20px!important;
    width:auto!important;
    max-height:calc(100dvh - 108px)!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
  }
}
@media(max-width:640px){
  .site-header .main-nav.open,
  .site-header .main-nav.open.is-closing{
    top:84px!important;
    left:14px!important;
    right:14px!important;
    max-height:calc(100dvh - 100px)!important;
  }
}
@media(prefers-reduced-motion:reduce){.clean4u-hamburger-scrim{transition:none!important}}



/* ===== V6.68 — cross-page language preload + complete footer choreography + iPad menu anchoring ===== */
/* When a non-Romanian language was previously selected, keep the document
   invisible only until the existing translation runtime applies that language.
   This prevents a Romanian first-paint flash between pages. */
html.clean4u-language-preload body{visibility:hidden!important}

/* Footer groups are animated as complete visual units by the language engine.
   Keep their compositor state predictable and avoid child-level snapping. */
.site-footer .footer-grid > div,
.site-footer .footer-bottom > span{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

/* iPad's header is intentionally translateZ(0) for Safari theme stability.
   That transform makes position:fixed descendants use the header as a fixed
   containing block in WebKit. On iPad, anchor the hamburger absolutely to the
   sticky header instead; because the header itself stays at viewport top, the
   menu is visible at every scroll depth without moving the document. */
@media(max-width:1320px){
  html.clean4u-ipad .site-header .main-nav.open,
  html.clean4u-ipad .site-header .main-nav.open.is-closing{
    position:absolute!important;
    top:calc(100% + 10px)!important;
    left:20px!important;
    right:20px!important;
    width:auto!important;
    max-height:calc(100dvh - 112px)!important;
    z-index:360!important;
  }
}
@media(max-width:640px){
  html.clean4u-ipad .site-header .main-nav.open,
  html.clean4u-ipad .site-header .main-nav.open.is-closing{
    left:14px!important;
    right:14px!important;
    top:calc(100% + 8px)!important;
    max-height:calc(100dvh - 94px)!important;
  }
}


/* ===== V6.69 — viewport hamburger portal + cache-stable handheld behaviour ===== */
@media(max-width:1320px){
  body > .main-nav.clean4u-nav-portal{
    display:flex!important;
    position:fixed!important;
    top:var(--c4u-nav-portal-top,92px)!important;
    left:20px!important;
    right:20px!important;
    width:auto!important;
    max-height:calc(100dvh - var(--c4u-nav-portal-top,92px) - 16px)!important;
    z-index:1505!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:13px!important;
    padding:18px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
    background:rgba(255,255,255,.992)!important;
    border:1px solid rgba(18,112,78,.13)!important;
    border-radius:22px!important;
    box-shadow:0 18px 42px rgba(8,39,31,.13)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    transform-origin:top center!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(0,0,0) scale(1)!important;
    transition:opacity .22s ease,transform .30s cubic-bezier(.16,1,.3,1),box-shadow .30s ease!important;
  }
  body > .main-nav.clean4u-nav-portal.clean4u-portal-mounting{
    opacity:0!important;
    transform:translate3d(0,-12px,0) scale(.988)!important;
  }
  body > .main-nav.clean4u-nav-portal.open.is-closing{
    opacity:0!important;
    pointer-events:none!important;
    transform:translate3d(0,-12px,0) scale(.988)!important;
  }
  body > .main-nav.clean4u-nav-portal > a:not(.btn){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    align-self:flex-start!important;
    width:max-content!important;
    min-width:148px!important;
    max-width:100%!important;
    min-height:44px!important;
    box-sizing:border-box!important;
    padding:11px 17px!important;
    margin:0!important;
    border:1px solid rgba(18,112,78,.13)!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,rgba(250,253,251,.99),rgba(237,247,242,.98))!important;
    color:#173d30!important;
    text-align:left!important;
    font-size:14px!important;
    font-weight:850!important;
    line-height:1.1!important;
    text-shadow:none!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 5px 14px rgba(8,39,31,.045)!important;
    opacity:1!important;
    transform:none!important;
  }
  body > .main-nav.clean4u-nav-portal > .btn{
    align-self:stretch!important;
    width:100%!important;
    margin-top:5px!important;
    text-align:center!important;
  }
  body > .main-nav.clean4u-nav-portal .lang-switch,
  body > .main-nav.clean4u-nav-portal .theme-toggle-desktop{display:none!important}
  html[data-theme="dark"] body > .main-nav.clean4u-nav-portal{
    background:rgba(9,22,17,.994)!important;
    border-color:rgba(117,213,165,.16)!important;
    box-shadow:0 20px 48px rgba(0,0,0,.34)!important;
  }
  html[data-theme="dark"] body > .main-nav.clean4u-nav-portal > a:not(.btn){
    background:linear-gradient(180deg,rgba(18,42,33,.99),rgba(13,31,25,.99))!important;
    border-color:rgba(117,213,165,.16)!important;
    color:#e8f5ef!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 5px 14px rgba(0,0,0,.13)!important;
  }
}
@media(max-width:640px){
  body > .main-nav.clean4u-nav-portal{left:14px!important;right:14px!important}
}

/* Safari backdrop stability: the portal is outside the sticky/transformed
   header, so neither iPhone nor iPad needs a page-position workaround. */
html.clean4u-iphone .clean4u-hamburger-scrim,
html.clean4u-ipad .clean4u-hamburger-scrim{
  -webkit-transform:translate3d(0,0,0)!important;
  transform:translate3d(0,0,0)!important;
  will-change:opacity!important;
}


/* ===== V6.70 — full-width portal menu + synchronized menu/scrim close ===== */
@media(max-width:1320px){
  body > .main-nav.clean4u-nav-portal{
    align-items:stretch!important;
  }
  body > .main-nav.clean4u-nav-portal > a:not(.btn){
    align-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  body > .main-nav.clean4u-nav-portal .mobile-policy-links{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    min-width:0!important;
    gap:10px!important;
    margin:2px 0 0!important;
    padding:0!important;
    opacity:1!important;
    transform:none!important;
    visibility:visible!important;
  }
  body > .main-nav.clean4u-nav-portal .mobile-policy-link{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    align-items:center!important;
    justify-content:flex-start!important;
    padding:11px 14px!important;
    margin:0!important;
  }
  body > .main-nav.clean4u-nav-portal.open.is-closing{
    transition:opacity .28s cubic-bezier(.4,0,.2,1),transform .28s cubic-bezier(.4,0,.2,1),box-shadow .28s ease!important;
  }
  .clean4u-hamburger-scrim.is-closing{
    transition:opacity .28s cubic-bezier(.4,0,.2,1),visibility 0s linear .30s!important;
    -webkit-transition:opacity .28s cubic-bezier(.4,0,.2,1),visibility 0s linear .30s!important;
  }
}
@media(max-width:520px){
  body > .main-nav.clean4u-nav-portal .mobile-policy-links{grid-template-columns:1fr!important}
}


/* ===== V6.71 — compact policy-style language fade ===== */
.reserved-page,.site-footer{
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}


/* ===== V6.76 — zero-dimming language viewport transition =====
   The translated viewport is fully opaque from frame one. The old immutable
   viewport sits above it and simply dissolves, so geometry can change freely
   underneath without black flashes, jumps, or partially resized live cards. */
@keyframes c4uLanguageViewportOldOut{
  from{opacity:1}
  to{opacity:0}
}

::view-transition-group(root){
  animation:none!important;
  transform:none!important;
}
::view-transition-image-pair(root){
  isolation:isolate!important;
}
::view-transition-new(root){
  z-index:1!important;
  opacity:1!important;
  animation:none!important;
  mix-blend-mode:normal!important;
  transform:none!important;
}
::view-transition-old(root){
  z-index:2!important;
  opacity:1;
  animation:c4uLanguageViewportOldOut 390ms cubic-bezier(.22,.68,.24,1) both!important;
  mix-blend-mode:normal!important;
  transform:none!important;
}

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),
  ::view-transition-new(root){animation:none!important}
}

/* Pause decorative keyframes while the immutable language snapshots are being
   composited. CSS transitions remain available; only looping shine/sweep
   animations are frozen so they cannot introduce unrelated motion. */
html.clean4u-language-view-transition body *{
  animation-play-state:paused!important;
}


/* ===== V6.88 — desktop policy menu bubbles ===== */
@media(min-width:1321px){
  .header-policy-menu{
    padding:12px!important;
    display:grid!important;
    gap:8px!important;
  }
  .header-policy-menu-title{
    padding:5px 10px 8px!important;
    text-align:center!important;
  }
  .header-policy-item{
    width:100%!important;
    min-height:46px!important;
    padding:11px 14px!important;
    border:1px solid rgba(20,83,63,.14)!important;
    border-radius:14px!important;
    background:rgba(230,244,237,.72)!important;
    color:#205a45!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    text-align:center!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.58),0 4px 12px rgba(8,39,31,.035)!important;
    transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease!important;
  }
  .header-policy-item>span:last-child{
    width:100%!important;
    text-align:center!important;
  }
  .header-policy-item:hover,
  .header-policy-item:focus-visible{
    background:#e4f3eb!important;
    border-color:rgba(20,83,63,.24)!important;
    color:#14533f!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 7px 16px rgba(8,39,31,.07)!important;
    outline:none!important;
  }
  .header-policy-item:active{transform:scale(.985)!important}

  html[data-theme="dark"] .header-policy-item{
    background:rgba(19,54,42,.72)!important;
    border-color:rgba(174,220,199,.12)!important;
    color:#cfe7dc!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 4px 12px rgba(0,0,0,.10)!important;
  }
  html[data-theme="dark"] .header-policy-item:hover,
  html[data-theme="dark"] .header-policy-item:focus-visible{
    background:#15392c!important;
    border-color:rgba(174,220,199,.22)!important;
    color:#eef8f3!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 7px 16px rgba(0,0,0,.18)!important;
  }
}