/* EasyRP public marketing pages (landing + pricing).
   Standalone look on top of Bootstrap: no app shell, no session.
   Palette: ink navy #132437, teal #0e7a5f (accent), amber #e8a13d (soon badge),
   warm neutral #f6f7f4. Prices always in monospace: the "listino" is the brand. */

:root {
    --pub-ink: #132437;
    --pub-ink-soft: #22303c;
    --pub-teal: #0e7a5f;
    --pub-teal-dark: #0a5c48;
    --pub-amber: #e8a13d;
    --pub-paper: #f6f7f4;
    --pub-line: #dfe3dd;
    --pub-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

body.pub-body {
    background: var(--pub-paper);
    color: var(--pub-ink-soft);
    -webkit-font-smoothing: antialiased;
}

/* ------------------------------------------------------------------ nav -- */

.pub-nav {
    background: var(--pub-ink);
}

.pub-nav .navbar-brand {
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.pub-nav .navbar-brand i {
    color: var(--pub-amber);
}

.pub-nav .nav-link {
    color: rgba(255, 255, 255, 0.75);
    font-weight: 500;
}

.pub-nav .nav-link:hover,
.pub-nav .nav-link:focus {
    color: #fff;
}

.pub-nav .nav-link.active {
    color: #fff;
    border-bottom: 2px solid var(--pub-amber);
}

/* ----------------------------------------------------------------- hero -- */

.pub-hero {
    background: var(--pub-ink);
    color: #fff;
    padding: 4.5rem 0 5rem;
}

.pub-hero h1 {
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.05;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
}

.pub-hero h1 .pub-hero-accent {
    color: var(--pub-amber);
}

.pub-hero .lead {
    color: rgba(255, 255, 255, 0.8);
    max-width: 34rem;
}

.pub-hero-note {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.875rem;
}

@media (prefers-reduced-motion: no-preference) {
    .pub-fade-up {
        animation: pubFadeUp 0.6s ease-out both;
    }

    .pub-fade-up-late {
        animation: pubFadeUp 0.6s ease-out 0.2s both;
    }

    @keyframes pubFadeUp {
        from { opacity: 0; transform: translateY(14px); }
        to   { opacity: 1; transform: none; }
    }
}

/* The signature: a receipt-style "listino" card in the hero. */
.pub-receipt {
    background: #fff;
    color: var(--pub-ink-soft);
    border-radius: 0.75rem;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
    font-family: var(--pub-mono);
    font-size: 0.9rem;
}

.pub-receipt-head {
    border-bottom: 2px solid var(--pub-ink);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.75rem;
}

.pub-receipt-row {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.pub-receipt-row .pub-leader {
    flex: 1;
    border-bottom: 2px dotted var(--pub-line);
    transform: translateY(-0.25em);
}

.pub-receipt-total {
    border-top: 2px solid var(--pub-ink);
    font-weight: 700;
}

.pub-receipt .pub-price {
    white-space: nowrap;
}

.pub-price {
    font-family: var(--pub-mono);
    font-weight: 700;
    color: var(--pub-teal-dark);
}

.pub-hero .btn-easyrp,
.btn-easyrp {
    background: var(--pub-teal);
    border-color: var(--pub-teal);
    color: #fff;
    font-weight: 600;
}

.btn-easyrp:hover,
.btn-easyrp:focus {
    background: var(--pub-teal-dark);
    border-color: var(--pub-teal-dark);
    color: #fff;
}

/* ------------------------------------------------------------- sections -- */

.pub-eyebrow {
    color: var(--pub-teal-dark);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 0.75rem;
    font-weight: 700;
}

.pub-section-title {
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--pub-ink);
}

.pub-point-card,
.pub-module-card {
    background: #fff;
    border: 1px solid var(--pub-line);
    border-radius: 0.75rem;
    height: 100%;
    transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}

@media (prefers-reduced-motion: no-preference) {
    .pub-point-card:hover,
    .pub-module-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 24px rgba(19, 36, 55, 0.08);
    }
}

.pub-point-card i,
.pub-module-card i {
    color: var(--pub-teal);
    font-size: 1.5rem;
}

.pub-module-card .pub-module-code {
    font-family: var(--pub-mono);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    color: #8a958f;
}

.pub-badge-included {
    background: var(--pub-teal);
    color: #fff;
}

.pub-badge-soon {
    background: var(--pub-amber);
    color: var(--pub-ink);
}

/* ---------------------------------------------------------------- API ---- */

.pub-api-band {
    background: #fff;
    border-top: 1px solid var(--pub-line);
    border-bottom: 1px solid var(--pub-line);
}

.pub-api-band code {
    font-family: var(--pub-mono);
    background: var(--pub-paper);
    color: var(--pub-ink);
    border: 1px solid var(--pub-line);
    border-radius: 0.375rem;
    padding: 0.15rem 0.45rem;
}

/* ------------------------------------------------------------- pricing --- */

.pub-pricing-card {
    background: #fff;
    border: 1px solid var(--pub-line);
    border-radius: 0.75rem;
    height: 100%;
}

.pub-pricing-card.pub-selected {
    border-color: var(--pub-teal);
    box-shadow: 0 0 0 2px rgba(14, 122, 95, 0.25);
}

.pub-pricing-card .pub-price-big {
    font-family: var(--pub-mono);
    font-weight: 700;
    font-size: 1.6rem;
    color: var(--pub-ink);
}

.pub-pricing-card .pub-price-unit {
    font-size: 0.8rem;
    color: #7d8781;
    font-family: var(--pub-mono);
}

.pub-pricing-card .form-check-input:checked {
    background-color: var(--pub-teal);
    border-color: var(--pub-teal);
}

/* Sticky quote bar: the running "preventivo" total. */
.pub-quote-bar {
    position: sticky;
    bottom: 0;
    z-index: 1020;
    background: var(--pub-ink);
    color: #fff;
    box-shadow: 0 -8px 24px rgba(19, 36, 55, 0.25);
}

.pub-quote-bar .pub-quote-total {
    font-family: var(--pub-mono);
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--pub-amber);
}

.pub-quote-bar .pub-quote-note {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.8rem;
}

/* ---------------------------------------------------------------- footer -- */

.pub-footer {
    background: var(--pub-ink);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.875rem;
}

.pub-footer a {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
}

.pub-footer a:hover,
.pub-footer a:focus {
    color: #fff;
    text-decoration: underline;
}

/* Visible keyboard focus on dark surfaces. */
.pub-nav a:focus-visible,
.pub-hero a:focus-visible,
.pub-footer a:focus-visible,
.pub-quote-bar a:focus-visible {
    outline: 2px solid var(--pub-amber);
    outline-offset: 2px;
}