/* Landing and public marketing pages (home, /vhod, /za-konsultanti, /proceduri, /konsultanti, /statii).
   Plain CSS on purpose: these pages use a few bespoke surfaces the Tailwind build doesn't need to know about. */

html {
    scroll-behavior: smooth;
}

/* ---------------------------------------------------------------- Hero (video) */

.landing-hero {
    position: relative;
    overflow: hidden;
    border-radius: 2rem;
    background: #0b1f4d url("/media/hero-poster.jpg") center / cover no-repeat;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18), 0 2px 10px rgba(15, 23, 42, 0.06);
    isolation: isolate;
}

.landing-hero-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
}

.landing-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(100deg, rgba(8, 20, 52, 0.92) 0%, rgba(12, 32, 84, 0.84) 45%, rgba(19, 52, 132, 0.55) 100%);
}

.landing-hero-inner {
    position: relative;
    padding: 2.5rem 1.5rem;
}

.landing-hero-grid {
    display: grid;
    gap: 2.5rem;
}

.landing-hero h1,
.landing-hero .landing-hero-title {
    color: #fff;
}

.landing-hero-lead {
    color: rgba(226, 232, 240, 0.95);
}

.landing-pill-dark {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: 9999px;
    padding: 0.45rem 0.9rem;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
    color: #dbeafe;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.landing-chip-dark {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: 9999px;
    padding: 0.5rem 0.85rem;
    background: rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
    color: #e2e8f0;
    font-size: 0.875rem;
}

.landing-eik-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    max-width: 34rem;
}

.landing-eik-input {
    flex: 1 1 12rem;
    min-height: 3.25rem;
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.96);
    padding: 0.8rem 1.25rem;
    font-size: 1rem;
    color: #0f172a;
    letter-spacing: 0.04em;
}

.landing-eik-input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.6);
}

.landing-eik-result {
    margin-top: 1rem;
    max-width: 40rem;
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.97);
    padding: 1.25rem;
    color: #0f172a;
    box-shadow: 0 18px 40px rgba(2, 6, 23, 0.25);
}

.landing-eik-result a {
    color: #1d4ed8;
}

/* ---------------------------------------------------------------- Hero: vertical fit
   The first screen has to end inside the viewport with clear space under the last control, at any
   height. Padding, gaps and type scale with svh; the optional rows (chips, auth intro) drop out on
   short screens instead of pushing the EIK form and the Google button under the fold.
   Opt-in via .landing-hero-fit (home and /za-konsultanti); other heroes keep their own sizing. */

.landing-hero-fit {
    --hero-pad: clamp(1.25rem, 4.6svh, 3.75rem);
    --hero-gap: clamp(0.75rem, 2.2svh, 1.5rem);
}

.landing-hero-fit .landing-hero-inner {
    padding: var(--hero-pad) 1.5rem;
}

.landing-hero-fit .landing-hero-title {
    margin-top: var(--hero-gap);
    font-size: clamp(1.625rem, min(8vw, 5.2svh), 3rem);
    line-height: 1.1;
}

.landing-hero-fit .landing-hero-lead {
    margin-top: var(--hero-gap);
    font-size: clamp(0.95rem, 2.4svh, 1.125rem);
    line-height: 1.55;
}

.landing-hero-fit .landing-eik-form,
.landing-hero-fit .landing-hero-actions {
    margin-top: calc(var(--hero-gap) * 1.4);
}

.landing-hero-fit .landing-eik-form {
    scroll-margin-top: 1.5rem;
}

.landing-hero-fit .landing-eik-note {
    margin-top: 0.5rem;
}

.landing-hero-fit .landing-hero-chips,
.landing-hero-fit .landing-hero-jump {
    margin-top: var(--hero-gap);
}

@media (min-width: 640px) {
    .landing-hero-fit .landing-hero-inner {
        padding: var(--hero-pad) 2.5rem;
    }
}

/* Touch: a chip that is a link gets a full-size tap target. */
@media (max-width: 1023px) {
    .landing-hero-fit a.landing-chip-dark {
        min-height: 2.75rem;
    }
}

@media (min-width: 1024px) {
    .landing-hero-fit .landing-hero-inner {
        padding: var(--hero-pad) 3rem;
    }

    .landing-hero-fit .landing-hero-title {
        font-size: clamp(2.25rem, min(4.4vw, 7.6svh), 3.75rem);
        line-height: 1.08;
    }

    /* The Google card sits beside the copy here, so the jump link would only point next door. */
    .landing-hero-fit .landing-hero-jump {
        display: none;
    }
}

/* Short stacked screens (small phones, landscape): keep the EIK form on the first screen, above the
   cookie bar, by tightening the rhythm and showing the first lines of the lead (the full text stays
   in the DOM). */
@media (max-width: 1023px) and (max-height: 700px) {
    .landing-hero-fit {
        --hero-pad: 1.25rem;
        --hero-gap: 0.75rem;
    }

    .landing-hero-fit .landing-hero-lead {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        overflow: hidden;
    }
}

/* Short desktop screens: the Google card is the tall column, so trim its intro and spacing. */
@media (min-width: 1024px) and (max-height: 700px) {
    .landing-hero-fit .landing-auth-card {
        padding: 1.25rem 1.5rem;
    }

    .landing-hero-fit .landing-auth-top p,
    .landing-hero-fit .ws-hint {
        display: none;
    }

    .landing-hero-fit .landing-auth-card .mt-5 {
        margin-top: 0.875rem;
    }
}

/* Narrow and short: the chips wrap to two rows here and would push the hero past the fold. */
@media (min-width: 1024px) and (max-width: 1279px) and (max-height: 700px) {
    .landing-hero-fit .landing-hero-chips-optional {
        display: none;
    }
}

/* ---------------------------------------------------------------- Shared surfaces */

.landing-hero-surface {
    border-radius: 2rem;
    background:
        radial-gradient(circle at top left, rgba(96, 165, 250, 0.18), transparent 28%),
        radial-gradient(circle at top right, rgba(37, 99, 235, 0.12), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.96));
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08), 0 2px 10px rgba(15, 23, 42, 0.04);
}

.landing-hero-glow {
    position: absolute;
    width: 16rem;
    height: 16rem;
    border-radius: 9999px;
    filter: blur(42px);
    opacity: 0.45;
    pointer-events: none;
}

.landing-hero-glow-left {
    top: -5rem;
    left: -4rem;
    background: rgba(96, 165, 250, 0.3);
}

.landing-hero-glow-right {
    right: -4rem;
    bottom: -6rem;
    background: rgba(37, 99, 235, 0.18);
}

.landing-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 9999px;
    padding: 0.45rem 0.9rem;
    background: rgba(255, 255, 255, 0.82);
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.9);
    color: #2563eb;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.landing-section {
    margin-top: 4.5rem;
    scroll-margin-top: 5rem;
}

.landing-section-title {
    font-size: 1.875rem;
    line-height: 2.25rem;
    font-weight: 700;
    color: #111827;
}

.landing-section-lead {
    margin-top: 0.75rem;
    max-width: 42rem;
    font-size: 1rem;
    line-height: 1.75rem;
    color: #4b5563;
}

.landing-primary-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 3.25rem;
    border-radius: 9999px;
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    color: white;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.28);
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, color 180ms ease;
}

.landing-primary-cta:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 20px 40px rgba(37, 99, 235, 0.32);
}

.landing-primary-cta:disabled {
    cursor: not-allowed;
    opacity: 0.55;
    box-shadow: none;
    transform: none;
}

.landing-secondary-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 3.25rem;
    border-radius: 9999px;
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    background: #fff;
    color: #1e3a8a;
    box-shadow: inset 0 0 0 1px #bfdbfe;
    transition: background-color 180ms ease;
}

.landing-secondary-cta:hover {
    background: #eff6ff;
}

.landing-ghost-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 3.25rem;
    border-radius: 9999px;
    padding: 0.9rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45);
    transition: background-color 180ms ease;
}

.landing-ghost-cta:hover {
    background: rgba(255, 255, 255, 0.1);
}

.landing-mini-chip {
    display: inline-flex;
    align-items: center;
    border-radius: 9999px;
    padding: 0.55rem 0.85rem;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, 0.9);
}

.landing-auth-shell {
    position: relative;
    scroll-margin-top: 6rem;
}

.landing-auth-card {
    position: relative;
    overflow: hidden;
    border-radius: 2rem;
    padding: 1.5rem;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12), 0 3px 12px rgba(15, 23, 42, 0.05);
}

.landing-google-host {
    display: flex;
    justify-content: center;
    min-height: 44px;
    padding: 0.2rem 0 0.1rem;
}

.landing-feature-card,
.landing-price-card,
.landing-door {
    border-radius: 1.5rem;
    border: 1px solid rgba(226, 232, 240, 0.88);
    background: rgba(255, 255, 255, 0.92);
    padding: 1.5rem;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.05);
}

.landing-door {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.landing-door-accent {
    border-color: rgba(147, 197, 253, 0.9);
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.9), rgba(255, 255, 255, 0.95));
}

.landing-icon-wrap {
    width: 3rem;
    height: 3rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #dbeafe;
}

.landing-stat {
    border-radius: 1.25rem;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: #fff;
    padding: 1.1rem 1.25rem;
}

.landing-stat-value {
    font-size: 2rem;
    line-height: 2.25rem;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.landing-stat-label {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #475569;
}

.landing-mock {
    border-radius: 1.5rem;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #fff;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.1);
    overflow: hidden;
}

.landing-mock-bar {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #eef2f7;
    background: #f8fafc;
}

.landing-mock-bar span {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 9999px;
    background: #cbd5e1;
}

.landing-trust-row {
    display: grid;
    gap: 0.75rem;
}

.landing-trust-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border-radius: 1.25rem;
    background: #fff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    padding: 1rem 1.1rem;
    font-size: 0.875rem;
    line-height: 1.4rem;
    color: #334155;
}

.landing-trust-item i {
    margin-top: 0.15rem;
    color: #2563eb;
}

.landing-faq {
    border-radius: 1.25rem;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #fff;
    padding: 0.25rem 1.25rem;
}

.landing-faq-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    cursor: pointer;
    list-style: none;
    padding: 1rem 0;
    font-weight: 600;
    color: #111827;
}

.landing-faq-summary::-webkit-details-marker {
    display: none;
}

.landing-faq[open] .landing-faq-plus {
    display: none !important;
}

.landing-faq[open] .landing-faq-minus {
    display: inline-block !important;
}

.landing-faq-body {
    padding: 0 0 1rem;
    font-size: 0.875rem;
    line-height: 1.75rem;
    color: #4b5563;
}

.landing-final {
    margin-top: 4.5rem;
    border-radius: 2rem;
    padding: 2rem 1.5rem;
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.95), rgba(255, 255, 255, 0.96));
    border: 1px solid rgba(191, 219, 254, 0.7);
}

.landing-prose h2 {
    margin-top: 2.25rem;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: #111827;
}

.landing-prose p,
.landing-prose li {
    margin-top: 0.9rem;
    font-size: 1.0625rem;
    line-height: 1.85rem;
    color: #334155;
}

.landing-prose ul {
    list-style: disc;
    padding-left: 1.25rem;
}

.eufunds-swal {
    border-radius: 1.25rem;
    padding: 1.5rem;
}

.eufunds-swal-confirm,
.eufunds-swal-cancel {
    border-radius: 9999px;
    padding: 0.75rem 1rem;
    font-weight: 600;
}

.eufunds-swal-confirm {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    color: #fff;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.24);
}

.eufunds-swal-cancel {
    background: #fff;
    border: 1px solid #d1d5db;
    color: #374151;
}

/* ------------------------------------------------------------ Workspace chooser
   Two tick-cards: looking for funding, consultant CRM. Used in the sign-in card (compact) and
   on /dobre-doshli. */
.ws-chooser {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.ws-legend {
    padding: 0;
    margin-bottom: 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.ws-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.ws-option {
    position: relative;
    display: block;
    cursor: pointer;
}

.ws-input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.ws-card {
    display: flex;
    height: 100%;
    flex-direction: column;
    gap: 0.2rem;
    border-radius: 1.25rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    padding: 1.1rem 1.1rem 1.2rem;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.ws-option:hover .ws-card {
    border-color: #93c5fd;
    transform: translateY(-1px);
}

.ws-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0.6rem;
}

.ws-icon {
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.9rem;
    background: #f1f5f9;
    color: #64748b;
    font-size: 1.1rem;
    transition: background-color 160ms ease, color 160ms ease;
}

.ws-check {
    display: inline-flex;
    width: 1.35rem;
    height: 1.35rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border: 1.5px solid #cbd5e1;
    background: #fff;
    color: transparent;
    font-size: 0.65rem;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.ws-title {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
    color: #0f172a;
}

.ws-sub {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #64748b;
}

.ws-input:checked + .ws-card {
    border-color: #3b82f6;
    background: linear-gradient(180deg, #eff6ff, #fff);
    box-shadow: 0 0 0 1px #3b82f6, 0 10px 24px rgba(37, 99, 235, 0.12);
}

.ws-input:checked + .ws-card .ws-icon {
    background: #dbeafe;
    color: #2563eb;
}

.ws-input:checked + .ws-card .ws-check {
    border-color: #2563eb;
    background: #2563eb;
    color: #fff;
}

.ws-input:focus-visible + .ws-card {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

.ws-hint {
    margin-top: 0.6rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
    color: #64748b;
}

.ws-chooser-compact .ws-legend {
    margin-bottom: 0.5rem;
}

.ws-chooser-compact .ws-options {
    gap: 0.5rem;
}

.ws-chooser-compact .ws-card {
    border-radius: 1rem;
    padding: 0.7rem 0.75rem 0.75rem;
    gap: 0.05rem;
}

.ws-chooser-compact .ws-card-top {
    margin-bottom: 0.35rem;
}

.ws-chooser-compact .ws-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 0.65rem;
    font-size: 0.85rem;
}

.ws-chooser-compact .ws-check {
    width: 1.1rem;
    height: 1.1rem;
    font-size: 0.55rem;
}

.ws-chooser-compact .ws-title {
    font-size: 0.875rem;
}

.ws-chooser-compact .ws-sub {
    font-size: 0.75rem;
    line-height: 1.35;
}

.ws-nudge .ws-options {
    animation: ws-nudge 320ms ease;
}

@keyframes ws-nudge {
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}

/* On phones the cards become rows (icon, text, tick): the full cards carry a sentence each,
   and the compact pair in the sign-in card is too narrow to sit side by side. */
@media (max-width: 639px) {
    .ws-chooser:not(.ws-chooser-compact) .ws-options {
        grid-template-columns: minmax(0, 1fr);
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-card {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        column-gap: 0.9rem;
        align-items: start;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-card-top {
        display: contents;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-icon {
        grid-row: 1 / span 2;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-check {
        grid-column: 3;
        grid-row: 1;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-title,
    .ws-chooser:not(.ws-chooser-compact) .ws-sub {
        grid-column: 2;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-title {
        grid-row: 1;
    }

    .ws-chooser:not(.ws-chooser-compact) .ws-sub {
        grid-row: 2;
    }
}

@media (max-width: 479px) {
    .ws-chooser-compact .ws-options {
        grid-template-columns: minmax(0, 1fr);
    }

    .ws-chooser-compact .ws-card {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        column-gap: 0.7rem;
        align-items: center;
    }

    .ws-chooser-compact .ws-card-top {
        display: contents;
    }

    .ws-chooser-compact .ws-icon {
        grid-row: 1 / span 2;
    }

    .ws-chooser-compact .ws-check {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .ws-chooser-compact .ws-title,
    .ws-chooser-compact .ws-sub {
        grid-column: 2;
    }

    .ws-chooser-compact .ws-title {
        grid-row: 1;
    }

    .ws-chooser-compact .ws-sub {
        grid-row: 2;
    }
}

@media (min-width: 640px) {
    .landing-auth-card,
    .landing-final {
        padding: 1.75rem;
    }

    .landing-hero-inner {
        padding: 3rem 2.5rem;
    }

    .landing-trust-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .landing-hero-grid {
        grid-template-columns: minmax(0, 1.15fr) 24rem;
        align-items: center;
    }

    .landing-hero-inner {
        padding: 3.75rem 3rem;
    }

    .landing-trust-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .landing-primary-cta,
    .ws-card,
    .ws-nudge .ws-options {
        transition: none;
        animation: none;
    }
}