/* =========================================================
   LANDING PAGE BASE
========================================================= */
.landing-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(245, 158, 11, .22), transparent 35%),
        radial-gradient(circle at top right, rgba(120, 53, 15, .18), transparent 35%),
        linear-gradient(135deg, #fff7ed, #fef3c7, #fffaf0);
    color: #2b1206;
}

/* =========================================================
   HEADER
========================================================= */
.landing-header {
    padding: 20px 0;
}

.landing-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #3f1d0b;
    color: #ffffff;
    padding: 10px 18px;
    border-radius: 999px;
    font-weight: 800;
}

.landing-nav-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* =========================================================
   HERO
========================================================= */
.landing-hero {
    padding: 60px 0 40px;
}

.landing-badge {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 999px;
    background: #fffbeb;
    color: #92400e;
    font-weight: 800;
    border: 1px solid #f59e0b;
    margin-bottom: 18px;
}

.landing-title {
    font-size: clamp(36px, 5vw, 66px);
    line-height: 1.02;
    font-weight: 950;
    letter-spacing: -1.5px;
    color: #2b1206;
}

.landing-title span {
    color: #b45309;
}

.landing-text {
    font-size: 18px;
    color: #5b3418;
    max-width: 620px;
}

.landing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

/* =========================================================
   BUTTONS
========================================================= */
.btn-tablea {
    background: linear-gradient(135deg, #7c2d12, #d97706);
    color: #ffffff;
    border: none;
    border-radius: 999px;
    padding: 14px 24px;
    font-weight: 900;
    box-shadow: 0 12px 28px rgba(124, 45, 18, .28);
}

.btn-tablea:hover {
    color: #ffffff;
    opacity: .95;
    transform: translateY(-1px);
}

.btn-outline-tablea,
.btn-admin-leads {
    background: #ffffff;
    color: #3f1d0b;
    border: 2px solid #3f1d0b;
    border-radius: 999px;
    padding: 14px 24px;
    font-weight: 800;
    transition: all .25s ease;
}

.btn-outline-tablea:hover,
.btn-admin-leads:hover {
    background: #3f1d0b;
    color: #ffffff;
    transform: translateY(-2px);
}

/* =========================================================
   CARDS / PRODUCT
========================================================= */
.product-card,
.feature-card,
.order-card,
.story-card,
.story-highlight,
.testimonial-card,
.faq-card,
.pricing-card,
.trust-item {
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(146, 64, 14, .14);
    border-radius: 26px;
    box-shadow: 0 18px 45px rgba(120, 53, 15, .10);
}

.product-card {
    padding: 22px;
}

.product-image {
    width: 100%;
    border-radius: 22px;
    object-fit: cover;
    max-height: 520px;
}

.offer-box {
    margin-top: 18px;
    background: #fff7ed;
    border: 2px dashed #d97706;
    border-radius: 22px;
    padding: 18px;
    text-align: center;
}

.price-tag {
    font-size: 46px;
    font-weight: 950;
    color: #b45309;
    line-height: 1;
}

/* =========================================================
   SECTIONS
========================================================= */
.landing-section {
    padding: 55px 0;
}

.section-title {
    color: #2b1206;
    font-weight: 950;
}

.feature-card,
.story-card,
.story-highlight,
.testimonial-card,
.pricing-card {
    padding: 24px;
    height: 100%;
}

.order-card,
.faq-card {
    padding: 24px;
}

.feature-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff7ed;
    color: #b45309;
    font-size: 24px;
    margin-bottom: 16px;
}

/* =========================================================
   TRUST SECTION
========================================================= */
.trust-section {
    padding: 20px 0 40px;
}

.trust-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.trust-item {
    padding: 22px;
    text-align: center;
}

.trust-item strong {
    display: block;
    font-size: 34px;
    font-weight: 950;
    color: #b45309;
    line-height: 1;
}

.trust-item span {
    display: block;
    margin-top: 8px;
    color: #5b3418;
    font-weight: 700;
}

/* =========================================================
   STORY
========================================================= */
.story-card p {
    color: #5b3418;
    font-size: 17px;
    line-height: 1.7;
}

.story-highlight {
    background: linear-gradient(135deg, #3f1d0b, #9a3412);
    color: #ffffff;
}

.story-highlight h3 {
    font-weight: 900;
    margin-bottom: 20px;
}

.flow-list {
    display: grid;
    gap: 14px;
}

.flow-list div {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    padding: 14px 16px;
    border-radius: 16px;
    font-weight: 800;
}

.flow-list span {
    width: 32px;
    height: 32px;
    background: #f59e0b;
    color: #3f1d0b;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 950;
}

/* =========================================================
   PRICING
========================================================= */
.pricing-card {
    position: relative;
    background: rgba(255,255,255,.95);
}

.pricing-card h4 {
    font-weight: 900;
    color: #2b1206;
}

.pricing-price {
    font-size: 42px;
    font-weight: 950;
    color: #b45309;
    margin: 14px 0;
}

.pricing-card p,
.pricing-card ul {
    color: #5b3418;
    line-height: 1.6;
}

.pricing-card ul {
    padding-left: 20px;
    margin: 22px 0;
}

.pricing-card li {
    margin-bottom: 10px;
}

.pricing-featured {
    border: 2px solid #d97706;
    transform: translateY(-10px);
    box-shadow: 0 25px 60px rgba(217,119,6,.22);
}

.pricing-tag {
    position: absolute;
    top: -14px;
    right: 24px;
    background: #d97706;
    color: #ffffff;
    padding: 7px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
}

/* =========================================================
   TESTIMONIALS / FAQ
========================================================= */
.testimonial-stars {
    font-size: 20px;
    color: #f59e0b;
    margin-bottom: 16px;
}

.testimonial-card p,
.faq-card p {
    color: #5b3418;
    line-height: 1.7;
}

.testimonial-card p {
    min-height: 110px;
}

.testimonial-author {
    font-weight: 900;
    color: #2b1206;
}

.faq-card h5 {
    font-weight: 900;
    color: #2b1206;
    margin-bottom: 8px;
}

.faq-card p {
    margin-bottom: 0;
}

/* =========================================================
   ORDER FORM
========================================================= */
.order-card .form-control,
.order-card .form-select {
    border-radius: 14px;
    min-height: 48px;
}

.order-card textarea.form-control {
    min-height: 110px;
}

/* =========================================================
   FOOTER
========================================================= */
.landing-footer-note {
    padding: 28px 0;
    color: #6b3b16;
    text-align: center;
}

/* =========================================================
   MOBILE CTA
========================================================= */
.mobile-cta {
    display: none;
}

/* =========================================================
   TABLET / SMALL SCREEN
========================================================= */
@media (max-width: 991px) {
    .landing-hero {
        padding-top: 30px;
    }

    .landing-actions .btn {
        width: 100%;
    }

    .mobile-cta {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9999;
        padding: 12px;
        background: rgba(255,255,255,.95);
        backdrop-filter: blur(10px);
        border-top: 1px solid rgba(0,0,0,.08);
    }

    .mobile-cta-btn {
        width: 100%;
        padding: 16px;
        font-size: 16px;
        font-weight: 900;
    }

    .landing-footer-note {
        padding-bottom: 90px;
    }

    .pricing-featured {
        transform: none;
    }
}

/* =========================================================
   MOBILE
========================================================= */
@media (max-width: 576px) {
    .landing-page {
        background: linear-gradient(180deg, #fff7ed, #fff3c4);
    }

    .landing-header {
        padding: 14px 0;
    }

    .landing-header .container {
        flex-direction: column;
        gap: 10px;
        align-items: stretch !important;
    }

    .landing-brand {
        width: 100%;
        justify-content: center;
        font-size: 14px;
        padding: 11px 14px;
    }

    .landing-nav-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
    }

    .landing-nav-actions .btn {
        width: 100%;
        padding: 13px 16px;
        font-size: 15px;
    }

    .landing-hero {
        padding: 28px 0 24px;
    }

    .landing-title {
        font-size: 34px;
        line-height: 1.08;
        letter-spacing: -1px;
    }

    .landing-text {
        font-size: 17px;
        line-height: 1.65;
    }

    .landing-badge {
        font-size: 14px;
        padding: 8px 13px;
    }

    .landing-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .landing-actions .btn {
        width: 100%;
        font-size: 16px;
        padding: 15px 18px;
    }

    .trust-grid {
        grid-template-columns: 1fr;
    }

    .product-card {
        padding: 14px;
        border-radius: 22px;
    }

    .product-image {
        max-height: 350px;
        object-fit: cover;
        border-radius: 18px;
    }

    .offer-box {
        padding: 16px 12px;
    }

    .price-tag {
        font-size: 42px;
    }

    .landing-section {
        padding: 42px 0;
    }

    .section-title {
        font-size: 30px;
        line-height: 1.15;
    }

    .feature-card,
    .story-card,
    .story-highlight,
    .testimonial-card,
    .faq-card,
    .order-card,
    .pricing-card {
        padding: 22px;
        border-radius: 22px;
    }

    .feature-card h4,
    .pricing-card h4 {
        font-size: 20px;
    }

    .feature-card p,
    .story-card p,
    .testimonial-card p,
    .faq-card p,
    .pricing-card p {
        font-size: 16px;
        line-height: 1.65;
    }

    .order-card {
        margin-bottom: 70px;
    }

    .order-card .form-label {
        font-size: 15px;
        font-weight: 700;
    }

    .order-card .form-control,
    .order-card .form-select {
        font-size: 16px;
        min-height: 52px;
    }

    .mobile-cta-btn {
        font-size: 15px;
    }
}