/* ============================================================
   LANDING PAGE — reaproveita os tokens definidos em style.css
   ============================================================ */

.lp-nav {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(244, 248, 242, 0.86);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--line);
}
.lp-nav-inner {
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 28px;
}
.lp-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.lp-brand img { width: 30px; height: 30px; }
.lp-brand span { font-size: 1.18rem; color: var(--sage-900); }
.lp-nav-links { display: flex; gap: 30px; align-items: center; }
.lp-nav-links a { font-size: 0.9rem; font-weight: 700; color: var(--ink-700); text-decoration: none; }
.lp-nav-links a:hover { color: var(--sage-700); }
.lp-nav-cta { display: flex; align-items: center; gap: 10px; }
@media (max-width: 780px) { .lp-nav-links { display: none; } }

/* ---------- HERO ---------- */
.lp-hero { position: relative; overflow: hidden; }
.lp-hero-inner { position: relative; z-index: 2; max-width: 1120px; margin: 0 auto; padding: 76px 28px 0; text-align: center; }
.lp-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 16px; border-radius: var(--r-pill);
    background: var(--surface); border: 1px solid var(--sage-300); color: var(--sage-700);
    font-size: 0.8rem; font-weight: 700; letter-spacing: 0.02em; margin-bottom: 26px;
}
.lp-eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-600); }
.lp-hero h1 {
    font-family: "Fraunces", Georgia, serif; font-weight: 600;
    font-size: clamp(2.1rem, 5.4vw, 3.7rem); line-height: 1.08; letter-spacing: -0.01em;
    max-width: 800px; margin: 0 auto; color: var(--sage-900);
}
.lp-hero h1 em { font-style: italic; color: var(--sage-700); }
.lp-hero-sub { max-width: 540px; margin: 20px auto 0; font-size: 1.08rem; color: var(--ink-700); line-height: 1.6; }
.lp-hero-cta { display: flex; gap: 14px; justify-content: center; margin-top: 32px; flex-wrap: wrap; }
.lp-hero-note { margin-top: 16px; font-size: 0.82rem; color: var(--ink-500); }

.lp-hero-cena {
    position: relative;
    z-index: 1;
    margin-top: 56px;
    min-height: 230px;
    overflow: hidden;
}
.lp-hero-cena .campo-fundo { border-radius: 0; }
.lp-hero-cena .campo-ceu { background: linear-gradient(180deg, transparent 0%, var(--cream-200) 70%, var(--gold-100) 100%); height: 55%; }
.lp-hero-cena .campo-horizonte { top: 55%; }
.lp-hero-cena .campo-terra { top: 55%; }
.lp-hero-trigos-lp {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: clamp(4px, 1.6vw, 16px);
    padding: 40px 20px 0;
    min-height: 230px;
    flex-wrap: wrap;
}
.lp-hero-trigos-lp img {
    display: block;
    filter: drop-shadow(0 3px 4px rgba(90, 68, 12, 0.2));
    animation: trigo-cresce 640ms var(--ease) both;
}

/* ---------- SECTION SHARED ---------- */
.lp-section { padding: 90px 0; }
.lp-section-inner { max-width: 1120px; margin: 0 auto; padding: 0 28px; }
.lp-head { max-width: 620px; margin: 0 auto 52px; text-align: center; }
.lp-kicker { display: block; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; color: var(--sage-600); margin-bottom: 12px; }
.lp-head h2 { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: clamp(1.7rem, 3.2vw, 2.3rem); color: var(--sage-900); letter-spacing: -0.01em; }
.lp-head p { margin-top: 14px; font-size: 1rem; color: var(--ink-700); line-height: 1.6; }

/* ---------- SOBRE ---------- */
.lp-about { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lp-about-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 60px; align-items: center; }
.lp-about-copy h2 { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: clamp(1.5rem, 2.8vw, 2rem); line-height: 1.28; color: var(--sage-900); }
.lp-about-copy p { margin-top: 16px; font-size: 0.98rem; color: var(--ink-700); line-height: 1.6; }
.lp-about-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px; }
.lp-stat-card { background: var(--surface-soft); border: 1px solid var(--line); border-radius: var(--r-md); padding: 16px 18px; }
.lp-stat-card .n { font-family: "Fraunces", Georgia, serif; font-size: 1.5rem; font-weight: 600; color: var(--sage-700); }
.lp-stat-card .l { font-size: 0.78rem; color: var(--ink-500); margin-top: 2px; }

.lp-mini-campo {
    position: relative;
    border-radius: var(--r-lg);
    min-height: 300px;
    overflow: hidden;
    border: 1px solid var(--gold-400);
    box-shadow: var(--shadow-md);
}
.lp-mini-campo .campo-fundo { border-radius: 0; }
.lp-mini-trigos {
    position: relative; z-index: 1;
    display: flex; align-items: flex-end; justify-content: center;
    gap: 14px; padding: 44px 20px 0; min-height: 300px;
}
.lp-mini-trigos img { filter: drop-shadow(0 3px 3px rgba(90, 68, 12, 0.18)); }

@media (max-width: 860px) { .lp-about-grid { grid-template-columns: 1fr; } .lp-about-stats { grid-template-columns: 1fr 1fr; } }

/* ---------- PAPEIS ---------- */
.lp-roles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.lp-role-card {
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
    padding: 30px 24px; transition: transform var(--t-med) var(--ease), box-shadow var(--t-med) var(--ease);
}
.lp-role-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
.lp-role-icon { width: 44px; height: 44px; border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.lp-role-card h3 { font-family: "Fraunces", Georgia, serif; font-size: 1.15rem; font-weight: 600; color: var(--sage-900); margin-bottom: 8px; }
.lp-role-card p { font-size: 0.88rem; color: var(--ink-700); line-height: 1.55; }
.lp-role-guardiao .lp-role-icon { background: var(--gold-100); }
.lp-role-gestor .lp-role-icon { background: var(--sage-100); }
.lp-role-semeador .lp-role-icon { background: var(--sky-100); }
.lp-role-tag { display: inline-block; margin-top: 14px; font-size: 0.72rem; font-weight: 700; padding: 4px 12px; border-radius: var(--r-pill); }
.lp-tag-guardiao { background: var(--gold-100); color: var(--gold-700); }
.lp-tag-gestor { background: var(--sage-100); color: var(--sage-700); }
.lp-tag-semeador { background: var(--sky-100); color: var(--sky-700); }
@media (max-width: 860px) { .lp-roles-grid { grid-template-columns: 1fr; } }

/* ---------- FUNCIONALIDADES ---------- */
.lp-features { background: var(--surface-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lp-feat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.lp-feat-card { background: var(--surface); border-radius: var(--r-lg); border: 1px solid var(--line); padding: 26px; display: flex; gap: 16px; align-items: flex-start; }
.lp-feat-num {
    font-family: "Fraunces", Georgia, serif; font-size: 0.85rem; font-weight: 600; color: var(--gold-700);
    border: 1.5px solid var(--gold-300); width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.lp-feat-card h3 { font-family: "Fraunces", Georgia, serif; font-size: 1.02rem; font-weight: 600; color: var(--sage-900); margin-bottom: 6px; }
.lp-feat-card p { font-size: 0.86rem; color: var(--ink-700); line-height: 1.55; }
.lp-feat-whats { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 0.76rem; font-weight: 700; color: var(--whatsapp-dark); }
.lp-feat-whats::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--whatsapp); }
@media (max-width: 860px) { .lp-feat-grid { grid-template-columns: 1fr; } }

/* ---------- TELAS ---------- */
.lp-browser {
    background: var(--surface); border-radius: var(--r-lg); border: 1px solid var(--line);
    box-shadow: var(--shadow-lift); overflow: hidden; max-width: 900px; margin: 0 auto;
}
.lp-browser-bar { display: flex; align-items: center; gap: 8px; padding: 13px 18px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.lp-browser-bar .dot { width: 10px; height: 10px; border-radius: 50%; }
.lp-browser-bar .dot:nth-child(1) { background: var(--blush-500); }
.lp-browser-bar .dot:nth-child(2) { background: var(--gold-500); }
.lp-browser-bar .dot:nth-child(3) { background: var(--sage-500); }
.lp-browser-url { margin-left: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 5px 15px; font-size: 0.76rem; color: var(--ink-500); }
.lp-browser-body { padding: 32px; background: var(--bg); }
.lp-dash-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 20px; }
.lp-dash-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 18px; }
.lp-dash-card h4 { font-family: "Fraunces", Georgia, serif; font-size: 0.92rem; font-weight: 600; color: var(--sage-900); margin: 0 0 12px; }
.lp-terr-row { display: flex; align-items: center; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 0.82rem; color: var(--ink-700); }
.lp-terr-row:last-child { border-bottom: none; }
.lp-progresso { font-family: "Fraunces", Georgia, serif; font-size: 1.8rem; font-weight: 600; color: var(--sage-700); }
.lp-bar-bg { background: var(--surface-soft); border-radius: var(--r-pill); height: 8px; overflow: hidden; margin-top: 8px; }
.lp-bar-fill { background: var(--gold-500); height: 100%; border-radius: var(--r-pill); }
@media (max-width: 700px) { .lp-dash-grid { grid-template-columns: 1fr; } .lp-browser-body { padding: 20px; } }

/* ---------- CTA ---------- */
.lp-cta-inner {
    background: linear-gradient(135deg, var(--sage-700), var(--sage-900));
    border-radius: var(--r-lg); padding: 60px 44px; text-align: center; position: relative; overflow: hidden;
}
.lp-cta-inner::after {
    content: ""; position: absolute; right: -60px; bottom: -60px; width: 260px; height: 260px; border-radius: 50%;
    background: radial-gradient(circle, rgba(217, 181, 60, 0.25), transparent 70%);
}
.lp-cta-inner h2 { font-family: "Fraunces", Georgia, serif; color: #fff; font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 600; position: relative; z-index: 1; }
.lp-cta-inner p { color: var(--sage-100); max-width: 460px; margin: 14px auto 0; position: relative; z-index: 1; }
.lp-cta-actions { display: flex; gap: 14px; justify-content: center; margin-top: 30px; flex-wrap: wrap; position: relative; z-index: 1; }
.lp-btn-white { background: #fff; color: var(--sage-700); }
.lp-btn-white:hover { background: var(--gold-100); }
.lp-btn-outline-white { border: 1.5px solid rgba(255, 255, 255, 0.4); color: #fff; background: transparent; }
.lp-btn-outline-white:hover { background: rgba(255, 255, 255, 0.1); }

/* ---------- FOOTER ---------- */
.lp-footer { border-top: 1px solid var(--line); padding: 40px 0; }
.lp-footer-inner { max-width: 1120px; margin: 0 auto; padding: 0 28px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; }
.lp-footer-inner .lp-brand span { font-size: 0.98rem; }
.lp-footer-inner p { font-size: 0.78rem; color: var(--ink-500); margin: 0; }