/* ==============================================================================================
   catalog-2026-comun.css — ce au in comun paginile /Catalog-Epilare-Laser_2026 (Potrivirea) si
   /Catalog-Epilare-Laser-2026-2 (Socoteala): formularul de lead, subsolul, cateva reguli de pagina.
   Prefix c26-. Paleta vine din variabilele de mai jos; fiecare pagina le suprascrie in CSS-ul ei.
   2026-10-19
   ============================================================================================== */
:root {
    --c26-fond: #ffffff;
    --c26-text: #1b1522;
    --c26-text2: #6b6072;
    --c26-accent: #6b0572;
    --c26-accent-hov: #55045b;
    --c26-accent-pal: #f3e4f4;
    --c26-linie: #e4dde7;
    --c26-eroare: #b3261e;
    --c26-raza: 12px;
    --c26-subsol-fond: #1b1522;
    --c26-subsol-text: #f3eef5;
    --c26-subsol-text2: #b9afc0;
    --c26-font: "Outfit", "Segoe UI", system-ui, sans-serif;
}

/* clip, nu hidden: hidden strica position:sticky (lectia din 8 oct 2026) */
html, body { overflow-x: clip; }

/* Butonul lateral „preturi” de pe mobil (layout) ar sta peste cipurile din primul ecran; ramane in DOM pentru GTM,
   dar nu se vede (precedentul oferta-prima-sedinta-laser.css). */
#MenuPretDreapta { display: none !important; }

.c26-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Formularul de lead ---------- */
.c26-form { padding: 0 16px 48px; scroll-margin-top: 72px; }
.c26-form-in { max-width: 640px; margin: 0 auto; background: var(--c26-accent-pal); border-radius: 20px; padding: 24px 20px; color: var(--c26-text); }
.c26-form-h2 { font-size: 26px; line-height: 1.15; margin: 0 0 6px; font-weight: 600; color: var(--c26-text); }
.c26-form-sub { margin: 0 0 16px; font-size: 16px; line-height: 1.5; color: var(--c26-text); }
.c26-form-corp { display: grid; gap: 14px; }
.c26-camp { display: grid; gap: 6px; }
.c26-camp label { font-size: 13px; font-weight: 600; color: var(--c26-text); }
.c26-camp input { width: 100%; min-height: 52px; padding: 0 14px; font: inherit; font-size: 16px; color: var(--c26-text); background: #fff; border: 1px solid var(--c26-text2); border-radius: var(--c26-raza); }
.c26-camp input:focus-visible { outline: 3px solid var(--c26-accent); outline-offset: 2px; }
.c26-camp input.input-validation-error { border-color: var(--c26-eroare); }
.c26-err { font-size: 13px; color: var(--c26-eroare); min-height: 0; }
.c26-err:empty { display: none; }
.c26-eroare { font-size: 14px; color: var(--c26-eroare); }
.c26-btn-trimite { width: 100%; min-height: 52px; border: 0; border-radius: var(--c26-raza); background: var(--c26-accent); color: #fff; font: inherit; font-size: 17px; font-weight: 600; cursor: pointer; }
.c26-btn-trimite:hover { background: var(--c26-accent-hov); }
.c26-btn-trimite:focus-visible { outline: 3px solid var(--c26-text); outline-offset: 3px; }
.c26-loader { display: block; margin: 0 auto; width: 48px; height: 48px; }
.c26-form-nota { margin: 14px 0 0; font-size: 13px; color: var(--c26-text2); text-align: center; }
.c26-form-wa { display: block; margin-top: 8px; text-align: center; color: var(--c26-accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; min-height: 44px; line-height: 44px; }

/* ---------- Subsolul ---------- */
.c26-subsol { background: var(--c26-subsol-fond); color: var(--c26-subsol-text); font-family: var(--c26-font); padding: 40px max(16px, env(safe-area-inset-left, 0px)) 20px; }
.c26-subsol-in { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width: 720px) { .c26-subsol-in { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .c26-subsol-in { grid-template-columns: 1.3fr 1fr 1fr 1.2fr; } }
.c26-subsol-sigla { font-family: "Playfair Display", Georgia, serif; font-size: 24px; font-weight: 700; margin-bottom: 8px; }
.c26-subsol-col p, .c26-subsol-col address { margin: 0; font-style: normal; font-size: 14px; line-height: 1.6; color: var(--c26-subsol-text2); }
.c26-subsol-col h3 { font-size: 15px; font-weight: 600; margin: 0 0 10px; color: var(--c26-subsol-text); }
.c26-subsol-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.c26-subsol-col a { color: var(--c26-subsol-text); text-decoration: none; }
.c26-subsol-col a:hover { text-decoration: underline; }
.c26-subsol-firma { font-size: 12px !important; margin-top: 8px !important; }
.c26-subsol-legal { max-width: 1120px; margin: 24px auto 0; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.14); display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 12px; }
.c26-subsol-legal a { color: var(--c26-subsol-text2); text-decoration: none; min-height: 32px; line-height: 32px; }
.c26-subsol-legal a:hover { text-decoration: underline; }