/* ══ LOGARE / ÎNREGISTRARE: formularul în stânga, caruselul în dreapta ═════════
   După conceptul Recraft (24 sept 2026). Încărcat după login.css / register.css.
   Peste 768px: două jumătăți egale, caruselul (includes/auth-carusel.php) stă pe
   loc sub meniu cât derulezi formularul. Până la 768px: o singură coloană, doar
   formularul, direct pe pagină — fără card, ca pe telefon la Recraft. */

/* Fără meniul site-ului (cerut de utilizator, 25 sept 2026): pagina e de sine
   stătătoare, ca la Recraft; ieșirea e „X"-ul din colț (.gw-inchide) și sigla.
   Se ascunde doar bara: header.php rămâne încărcat (scripturi, fereastra de logare). */
body:has(.gw-split) header.nav { display: none !important;}

:root .gw-page.gw-split {
    display: grid; grid-template-columns: minmax(0, 1fr);
    min-height: calc(100vh / var(--mv-z, 1));
    padding-top: 0;
    overflow: visible;                 /* `hidden` ar opri position: sticky pe carusel */
    background: #f3f7fc;}
/* body are overflow-x: hidden (style.css), ceea ce îl face container de derulare și
   strică `sticky`; `clip` taie la fel conținutul lat, dar nu creează container */
body:has(.gw-split) { overflow-x: clip;}

/* ── Formularul, direct pe pagină ──────────────────────────────────────── */
.gw-split .gw-wrap {
    min-height: calc(100vh / var(--mv-z, 1));
    padding: 24px 24px 20px;           /* logarea încape în primul ecran și pe 1366×768 */}
:root .gw-split .gw-card {
    max-width: 360px; padding: 0; border-radius: 0;
    background: none; animation: none;}
:root .gw-split .gw-card-inner {
    padding: 0; border-radius: 0; overflow: visible;
    background: none;}
.gw-split .gw-card-inner::before { display: none;}

.gw-split .gw-header { margin-bottom: 22px;}
.gw-split .gw-orb { width: 56px; height: 56px; margin-bottom: 18px; border-radius: 50%;}
.gw-split .gw-orb:focus-visible { outline: 3px solid #0a3aa5; outline-offset: 4px;}

/* „X": cerc închis, semi-transparent, cu X alb — se vede la fel pe orice imagine din
   carusel și pe fundalul deschis de pe telefon. Pe PC stă fix peste carusel (care e
   și el fix); pe telefon se derulează cu pagina, ca să nu treacă peste câmpuri. */
.gw-inchide {
    position: fixed; top: 20px; right: 22px; z-index: 30;
    width: 46px; height: 46px; display: grid; place-items: center;
    border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(11, 22, 35, 0.58); color: #ffffff;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    box-shadow: 0 6px 20px rgba(3, 12, 28, 0.28);
    text-decoration: none;
    transition: background 0.2s, transform 0.2s;}
.gw-inchide svg { width: 22px; height: 22px;}
.gw-inchide:hover { background: rgba(11, 22, 35, 0.82); color: #ffffff; transform: scale(1.06);}
.gw-inchide:focus-visible { outline: 3px solid #6ec1ff; outline-offset: 3px;}
.gw-split .gw-title {
    margin: 0 0 6px;
    font-size: 1.65rem; font-weight: 800; letter-spacing: -0.015em; line-height: 1.15;
    color: #0b1623;}
.gw-split .gw-sub { font-size: 0.9rem; color: #4a5d74;}

.gw-split .gw-input {
    background: #ffffff; border: 1px solid #cfdcec; border-radius: 12px;
    color: #0b1623;}
.gw-split .gw-input:focus {
    border-color: #0a3aa5; background: #ffffff;
    box-shadow: none;   /* doar bordura fină de 1px (vezi base.css) */}
.gw-split .gw-submit { border-radius: 12px;}
.gw-split .gw-divider-line { background: #d5e0ee;}
.gw-split .gw-divider-text { color: #4a5d74; font-size: 0.72rem; letter-spacing: 0.04em;}
.gw-split .gw-soc {
    background: #ffffff; border: 1px solid #cfdcec; color: #0b1623;}
.gw-split .gw-soc:hover { border-color: #0a3aa5; background: #ffffff; color: #0a3aa5;}
.gw-split .gw-footer { margin-top: 20px; padding-top: 16px; border-top-color: #d5e0ee;}

/* ── Fără footerul site-ului (ca la Recraft) ─────────────────────────────
   Doar partea vizibilă: fișierul footerului rămâne încărcat, pentru că aduce
   bannerul și scripturile de consimțământ la cookie-uri (stau în afara
   elementului <footer>). Linkurile legale sunt sub formular, în .gw-legal. */
body:has(.gw-split) .site-footer { display: none !important;}
.gw-legal {
    margin: 18px auto 0; max-width: 320px; text-align: center;
    font-size: 0.74rem; line-height: 1.55; color: #6b7c93;}
.gw-legal a { color: #4a5d74; text-decoration: underline; text-underline-offset: 2px;}
.gw-legal a:hover { color: #0a3aa5;}

/* ── Caruselul ─────────────────────────────────────────────────────────── */
.gw-carusel { display: none;}

@media (min-width: 769px) {
    :root .gw-page.gw-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);}

    .gw-carusel {
        display: block; position: sticky; top: 0; align-self: start;
        height: calc(100vh / var(--mv-z, 1)); min-height: 480px;
        overflow: hidden; isolation: isolate;
        background: #0b1623; color: #ffffff;}
}

.gw-slide {
    position: absolute; inset: 0; margin: 0;
    opacity: 0; transition: opacity 0.9s ease;}
.gw-slide.is-activ { opacity: 1;}
.gw-slide picture,
.gw-slide img { position: absolute; inset: 0; width: 100%; height: 100%;}
.gw-slide img { display: block; object-fit: cover; object-position: var(--poz, 50% 50%);}
/* umbră de jos, ca textul să se citească pe orice imagine */
.gw-slide::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(180deg, rgba(8, 23, 49, 0) 42%, rgba(8, 23, 49, 0.5) 68%, rgba(8, 23, 49, 0.9) 100%);}

.gw-slide-text {
    position: absolute; left: 0; right: 0; bottom: 64px; z-index: 1;
    padding: 0 48px; text-align: center;}
.gw-slide-titlu {
    margin: 0 0 10px;
    font-size: clamp(1.55rem, 2.5vw, 2.25rem); font-weight: 800;
    line-height: 1.12; letter-spacing: -0.015em; color: #ffffff;
    text-wrap: balance;}
.gw-slide-desc {
    margin: 0 auto; max-width: 30rem;
    font-size: 1rem; line-height: 1.55; color: rgba(255, 255, 255, 0.86);
    text-wrap: balance;}

.gw-carusel-puncte {
    position: absolute; left: 0; right: 0; bottom: 28px; z-index: 2;
    display: flex; justify-content: center; gap: 8px;}
.gw-punct {
    width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px;
    background: rgba(255, 255, 255, 0.45); cursor: pointer;
    transition: width 0.3s, background 0.3s;}
.gw-punct:hover { background: rgba(255, 255, 255, 0.75);}
.gw-punct.is-activ { width: 22px; background: #ffffff;}
.gw-punct:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px;}

/* ── Slide-ul Mativera+: textul sus, pe zidul alb, în nuanțe de cristal ───
   Jumătatea de sus a pozei e zid alb, omul stă jos: alb pe umbră i-ar acoperi
   mâinile. Aici textul e închis la culoare, în tonuri de pietre prețioase
   (safir → albastru → ametist → acvamarin), care curg încet ca lumina printr-un
   cristal; cu „mișcare redusă" gradientul stă pe loc. */
.gw-slide--plus::after {
    background:
        radial-gradient(120% 70% at 0% 0%, rgba(255, 255, 255, 0.62) 0%, rgba(255, 255, 255, 0.28) 45%, rgba(255, 255, 255, 0) 70%),
        linear-gradient(180deg, rgba(8, 23, 49, 0) 80%, rgba(8, 23, 49, 0.42) 100%);}
.gw-slide--plus .gw-slide-text {
    top: 48px; bottom: auto; left: 44px; right: auto;
    max-width: min(360px, 52%); padding: 0; text-align: left;}
.gw-slide-eticheta {
    display: inline-flex; align-items: center; margin-bottom: 14px;
    padding: 5px 12px 5px 13px; border-radius: 999px;
    border: 1px solid rgba(138, 108, 240, 0.32);
    background: rgba(255, 255, 255, 0.58);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(10, 58, 165, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    font-size: 0.72rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
    color: #0a3aa5;}
.gw-slide--plus .gw-slide-titlu {
    margin-bottom: 12px;
    font-size: clamp(1.9rem, 3vw, 2.6rem); line-height: 1.08;
    background: linear-gradient(110deg, #0a3aa5 0%, #3d6fe6 24%, #8a6cf0 48%, #2fa7c9 72%, #0a3aa5 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
    /* o muchie fină de lumină sub litere, ca la sticla șlefuită */
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.85));}
.gw-slide--plus.is-activ .gw-slide-titlu { animation: gwCristal 9s ease-in-out infinite;}
@keyframes gwCristal {
    0%, 100% { background-position: 0% 50%;}
    50% { background-position: 100% 50%;}
}
.gw-slide--plus .gw-slide-desc {
    margin: 0; max-width: 330px;
    font-size: 0.98rem; line-height: 1.55; font-weight: 500;
    color: #26364f;}

/* ecran ultralat: cutia caruselului e mai lată decât înaltă, deci omul iese mai mare —
   cadrul urcă puțin (altfel ar tăia capul), iar textul se strânge ca să nu-i intre în umăr */
@media (min-aspect-ratio: 2/1) {
    .gw-slide--plus img { object-position: 68% 78%;}
    .gw-slide--plus .gw-slide-text { max-width: 40%;}
}

@media (prefers-reduced-motion: reduce) {
    .gw-slide, .gw-punct, .gw-inchide { transition: none;}
    .gw-inchide:hover { transform: none;}
    .gw-slide--plus.is-activ .gw-slide-titlu { animation: none;}
}

/* ── Telefon: doar formularul ──────────────────────────────────────────── */
@media (max-width: 768px) {
    .gw-split .gw-wrap { min-height: 0; align-items: flex-start; padding: 32px 24px 44px;}
    .gw-inchide { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px;}
    :root .gw-split .gw-card { max-width: 420px;}
}