/* Landing-only visual system. Shared directory and seller styles stay independent. */
.marketing-landing {
    --mk-primary: #5145cd;
    --mk-primary-dark: #3f33ad;
    --mk-ink: #242333;
    --mk-muted: #686775;
    --mk-border: #e5e3e9;
    --mk-soft: #f7f6f3;
    background: #fcfbf8;
}
.marketing-landing .marketing-container { max-width: 1280px; padding-inline: 32px; }
.marketing-landing section[id] { scroll-margin-top: 100px; }
.marketing-landing .marketing-header { background: rgba(252,251,248,.95); border-color: #eae8e3; box-shadow: none; }
.marketing-landing .navbar { min-height: 86px; }
.marketing-landing .marketing-brand { font-size: 1.25rem; letter-spacing: -.05em; gap: 10px; }
.marketing-landing .marketing-brand img { border-radius: 12px; }
.marketing-landing .marketing-brand-mark { background: var(--mk-primary); color: #fff; border: 0; }
.marketing-landing .marketing-nav .nav-link { color: #585663; font-size: .8rem; }
.marketing-landing .btn { border-radius: 10px; font-weight: 600; font-size: .84rem; padding: 13px 21px; }
.marketing-landing .btn-primary { --bs-btn-bg: var(--mk-primary); --bs-btn-border-color: var(--mk-primary); --bs-btn-hover-bg: var(--mk-primary-dark); --bs-btn-hover-border-color: var(--mk-primary-dark); background: var(--mk-primary); border-color: var(--mk-primary); box-shadow: 0 4px 0 rgba(38,29,100,.13); color: #fff; }
.marketing-landing .btn-primary:hover { background: var(--mk-primary-dark); border-color: var(--mk-primary-dark); box-shadow: 0 7px 18px rgba(38,29,100,.18); }
.marketing-landing .btn-outline-primary { --bs-btn-color: var(--mk-primary); --bs-btn-border-color: #d7d3ef; --bs-btn-hover-bg: var(--mk-primary); --bs-btn-hover-border-color: var(--mk-primary); }
.marketing-landing .btn-outline-secondary { color: var(--mk-ink); border-color: #dcd9e1; background: transparent; }
.marketing-landing .btn-outline-secondary:hover { background: #eeecf4; border-color: #bcb6d2; }
.marketing-landing a:focus-visible, .marketing-landing button:focus-visible { outline: 3px solid #7161dd; outline-offset: 4px; box-shadow: none; }
.marketing-landing .marketing-header-actions .btn { min-height: 42px; padding: 10px 18px; }
.marketing-landing .marketing-header-actions .btn-outline-secondary { border-color: transparent; }
.marketing-landing .marketing-hero { position: relative; padding: 50px 0 70px; background: #fcfbf8; }
.marketing-landing .marketing-hero-card { min-height: 565px; grid-template-columns: 1fr 1fr; gap: 56px; }
.marketing-landing .marketing-hero-copy { padding: 20px 0; }
.marketing-landing .marketing-eyebrow { color: var(--mk-primary); font-size: .68rem; font-weight: 700; letter-spacing: .12em; line-height: 1.6; }
.marketing-landing .marketing-hero-copy > .marketing-eyebrow { padding: 7px 12px; margin-bottom: 25px; border: 1px solid #ded9f3; border-radius: 50px; background: #f2effc; font-size: .62rem; letter-spacing: .08em; }
.marketing-landing .marketing-hero h1 { max-width: 640px; font-size: clamp(2.9rem,4.75vw,4.35rem); line-height: 1.08; letter-spacing: -.065em; font-weight: 700; text-wrap: balance; }
.marketing-landing .marketing-hero-copy > p { max-width: 450px; margin: 24px 0 28px; font-size: .98rem; line-height: 1.85; }
.marketing-landing .marketing-hero-actions { gap: 12px; }
.marketing-landing .marketing-hero-actions .btn { min-height: 52px; }
.marketing-landing .marketing-hero-proof { margin-top: 24px; gap: 10px 16px; font-size: .65rem; font-weight: 500; color: var(--mk-muted); }
.marketing-landing .marketing-hero-proof i { color: #5e5889; }
.marketing-landing .marketing-hero-visual { position: relative; width: 100%; max-width: none; padding: 24px 24px 20px; overflow: visible; border: 1px solid #ded9ef; border-radius: 26px; background: #eeeaf9; transform: rotate(-2deg); }
.marketing-preview-label, .marketing-preview-caption { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #655c83; }
.marketing-preview-label { margin-bottom: 23px; font-size: .68rem; font-weight: 600; }
.marketing-preview-label > span:first-child { display: flex; align-items: center; gap: 8px; }
.marketing-preview-dot { width: 7px; height: 7px; border-radius: 50%; background: #5b9474; box-shadow: 0 0 0 4px #deebe3; flex: 0 0 auto; }
.marketing-preview-frame { overflow: hidden; border: 1px solid #dfdae9; border-radius: 13px; background: #fff; box-shadow: 0 20px 40px -20px #554b7d66; }
.marketing-preview-frame > img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; }
.marketing-preview-caption { margin-top: 24px; font-size: .57rem; }
.marketing-preview-caption > span:first-child { font-weight: 700; letter-spacing: .17em; }
.marketing-preview-caption i { margin-left: 5px; }
.marketing-landing .marketing-browser-mockup { transform: none; border: 0; border-radius: 0; box-shadow: none; }
.marketing-landing .marketing-mockup-content { height: 320px; grid-template-columns: 58px 1fr; }
.marketing-landing .marketing-mockup-main { padding: 16px; }
.marketing-landing .marketing-mockup-banner { height: 130px; background: #6553b5; }
.marketing-landing .marketing-mockup-products span { height: 100px; }
.marketing-landing .marketing-mockup-sidebar { padding: 20px 8px; }
.marketing-landing .marketing-float-card { z-index: 2; padding: 13px 17px; border-radius: 13px; transform: rotate(2deg); box-shadow: 0 12px 28px #34285415; }
.marketing-landing .marketing-float-card.is-orders { top: 94px; left: -30px; }
.marketing-landing .marketing-float-card.is-orders > i { background: #f0ecfa; color: var(--mk-primary); }
.marketing-landing .marketing-float-card.is-whatsapp { right: -18px; bottom: 68px; }
.marketing-landing .marketing-trusted { padding: 30px 0; background: #f5f4f0; border-color: #eae8e3; }
.marketing-landing .marketing-trusted-heading span { color: #74717d; font-size: .6rem; }
.marketing-landing .marketing-trusted-heading h2 { margin-top: 7px; font-size: .88rem; }
.marketing-landing .marketing-trusted-list { gap: 24px; }
.marketing-landing .marketing-trusted-list span { padding: 8px 0; border: 0; border-radius: 0; color: #5e5a67; font-size: .87rem; }
.marketing-landing .marketing-trusted-list i { color: #8a8595; font-size: 1.2rem; }
.marketing-landing .marketing-section { padding: 92px 0; }
.marketing-landing .marketing-section-soft { background: #f5f4f0; border-color: #eae8e3; }
.marketing-landing .marketing-section-heading { max-width: 670px; margin-bottom: 42px; }
.marketing-landing .marketing-section-heading h2, .marketing-landing .marketing-featured-heading h2, .marketing-landing .marketing-demo h2, .marketing-landing .marketing-contact h2 { font-size: clamp(2rem,3.3vw,2.85rem); font-weight: 600; line-height: 1.16; letter-spacing: -.055em; text-wrap: balance; }
.marketing-landing .marketing-section-heading p, .marketing-landing .marketing-featured-heading p { font-size: .91rem; }
.marketing-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.marketing-landing .marketing-feature-card { position: relative; overflow: hidden; min-height: 225px; padding: 30px; border-radius: 18px; border-color: #e7e4eb; background: #fff; box-shadow: none; }
.marketing-landing .marketing-feature-cell:nth-child(1) .marketing-feature-card { background: #eeeaf9; border-color: #e3dcf6; }
.marketing-landing .marketing-feature-cell:nth-child(4) .marketing-feature-card { background: #edf4ee; border-color: #dde9df; }
.marketing-landing .marketing-feature-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px #30293e0a; }
.marketing-landing .marketing-icon { width: 44px; height: 44px; border-radius: 12px; margin-bottom: 23px; background: #f0edf8; color: var(--mk-primary); }
.marketing-landing .marketing-feature-cell:nth-child(4) .marketing-icon { background: #dbeadd; color: #35734c; }
.marketing-landing .marketing-feature-card h3 { font-size: 1rem; letter-spacing: -.025em; }
.marketing-landing .marketing-feature-card p { max-width: 310px; font-size: .83rem; line-height: 1.8; }
.marketing-landing .marketing-steps { gap: 0; }
.marketing-landing .marketing-steps article { padding: 16px 34px; border: 0; border-right: 1px solid #dedce3; border-radius: 0; background: transparent; box-shadow: none; }
.marketing-landing .marketing-steps article:last-child { border-right: 0; }
.marketing-landing .marketing-step-number { top: 12px; right: 34px; font-size: 2.5rem; font-weight: 500; color: #d1cbdc; letter-spacing: -.07em; }
.marketing-landing .marketing-business-grid article { border-color: #e7e4eb; box-shadow: none; border-radius: 16px; }
.marketing-landing .marketing-demo { padding-top: 0; }
.marketing-landing .marketing-demo-card { min-height: 490px; padding: 58px; gap: 55px; border-radius: 26px; background: #282339; }
.marketing-landing .marketing-demo .marketing-eyebrow { color: #bfb2f1; }
.marketing-landing .marketing-demo-copy p { color: #c0bacb; font-size: .91rem; }
.marketing-landing .marketing-demo-visual { height: 380px; border-color: #ffffff15; background: #373046; box-shadow: none; }
.marketing-landing .marketing-demo-visual::before { border-color: #aea0dc17; }
.marketing-landing .marketing-demo-visual::after { background: #aea0dc17; }
.marketing-landing .marketing-featured-stores { background: #fcfbf8; }
.marketing-landing .marketing-store-card { box-shadow: none; border-color: #e7e4eb; border-radius: 18px; }
.marketing-landing .marketing-store-card:hover { box-shadow: 0 16px 30px #30293e10; }
.marketing-landing .marketing-pricing-grid { gap: 18px; }
.marketing-landing .marketing-price-card { border-radius: 18px; box-shadow: none; }
.marketing-landing .marketing-price-card.is-featured { border: 2px solid var(--mk-primary); background: #f8f6ff; box-shadow: 0 12px 30px #5145cd0d; }
.marketing-landing .marketing-popular { top: -12px; right: 18px; padding: 6px 12px; color: #fff; background: var(--mk-primary); font-size: .58rem; letter-spacing: .04em; }
.marketing-landing .marketing-pricing-grid .marketing-price-heading { min-height: 112px; padding-right: 0; }
.marketing-landing .marketing-quote { border-radius: 18px; padding: 30px; border-color: #e7e4eb; }
.marketing-landing .marketing-stars { color: #a17d32; }
.marketing-landing .marketing-quote figcaption > span { background: #eeeaf9; color: var(--mk-primary); border-radius: 50%; }
.marketing-landing .marketing-faq .accordion-item { border-color: #e5e1e9; border-radius: 13px; }
.marketing-landing .marketing-faq .accordion-button { color: var(--mk-ink); font-size: .92rem; }
.marketing-landing .marketing-faq .accordion-button:not(.collapsed) { background: #f0edf8; color: var(--mk-primary); box-shadow: none; }
.marketing-landing .marketing-cta { padding: 56px; background: #5145cd; border-radius: 24px; box-shadow: none; }
.marketing-landing .marketing-cta h2 { font-weight: 600; line-height: 1.15; }
.marketing-landing .marketing-cta p { color: #e0dcfb; }
.marketing-landing .marketing-contact { padding-top: 0; background: #fcfbf8; }
.marketing-landing .marketing-contact::before { display: none; }
.marketing-landing .marketing-contact-card { min-height: 490px; border-color: #e7e4eb; border-radius: 24px; box-shadow: none; grid-template-columns: 1.1fr 1fr; }
.marketing-landing .marketing-contact-copy { padding: 50px; }
.marketing-landing .marketing-contact-copy > p { font-size: .94rem; }
.marketing-landing .marketing-contact-panel { background: #282339; padding: 40px; }
.marketing-landing .marketing-contact-panel-heading p, .marketing-landing .marketing-contact-note small { color: #b0a9be; }
.marketing-landing .marketing-footer { background: #f5f4f0; border-top: 1px solid #eae8e3; }
.marketing-landing .marketing-footer-bottom { color: #77717f; }
@media (max-width: 1199.98px) {
    .marketing-landing .marketing-hero-card { gap: 36px; }
    .marketing-landing .marketing-hero h1 { font-size: 3.4rem; }
    .marketing-landing .marketing-trusted-list { gap: 16px; }
    .marketing-landing .marketing-contact-copy { padding: 36px; }
}
@media (max-width: 991.98px) {
    .marketing-landing .navbar { min-height: 74px; }
    .marketing-landing .marketing-hero { padding: 36px 0 56px; }
    .marketing-landing .marketing-hero-card { grid-template-columns: 1fr; gap: 36px; }
    .marketing-landing .marketing-hero h1 { max-width: 650px; font-size: 3.8rem; }
    .marketing-landing .marketing-hero-copy > p { max-width: 520px; margin-inline: auto; }
    .marketing-landing .marketing-hero-visual { max-width: 600px; margin: 0 auto; }
    .marketing-feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .marketing-landing .marketing-trusted > .marketing-container { flex-direction: column; gap: 15px; align-items: center; text-align: center; }
    .marketing-landing .marketing-steps { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .marketing-landing .marketing-steps article { padding: 16px 20px; }
    .marketing-landing .marketing-step-number { right: 20px; }
    .marketing-landing .marketing-demo-card, .marketing-landing .marketing-contact-card { grid-template-columns: 1fr; }
    .marketing-landing .marketing-demo-visual { max-width: 500px; }
}
@media (max-width: 767.98px) {
    .marketing-landing .marketing-container { padding-inline: 20px; }
    .marketing-landing .marketing-section { padding: 64px 0; }
    .marketing-landing .marketing-hero h1 { font-size: clamp(2.5rem,8.5vw,3.6rem); letter-spacing: -.055em; }
    .marketing-landing .marketing-hero-copy > .marketing-eyebrow { font-size: .58rem; }
    .marketing-landing .marketing-hero-visual { padding: 18px 16px; transform: none; border-radius: 20px; }
    .marketing-preview-label { font-size: .6rem; margin-bottom: 16px; }
    .marketing-preview-caption { font-size: .5rem; margin-top: 18px; }
    .marketing-landing .marketing-hero-actions { flex-direction: row; justify-content: center; }
    .marketing-landing .marketing-hero-proof { justify-content: center; align-items: center; flex-direction: row; }
    .marketing-landing .marketing-trusted-list { justify-content: center; gap: 8px 20px; }
    .marketing-landing .marketing-trusted-list span { font-size: .78rem; }
    .marketing-landing .marketing-feature-card { padding: 24px; }
    .marketing-landing .marketing-steps { grid-template-columns: 1fr; gap: 22px; }
    .marketing-landing .marketing-steps article { padding: 0 0 22px; border-right: 0; border-bottom: 1px solid #dedce3; }
    .marketing-landing .marketing-steps article:last-child { border-bottom: 0; padding-bottom: 0; }
    .marketing-landing .marketing-step-number { right: 0; top: 0; }
    .marketing-landing .marketing-demo { padding-top: 0; }
    .marketing-landing .marketing-demo-card { padding: 34px 22px; gap: 30px; }
    .marketing-landing .marketing-demo-visual { height: 340px; }
    .marketing-landing .marketing-cta { padding: 34px 26px; }
    .marketing-landing .marketing-contact { padding-top: 0; }
    .marketing-landing .marketing-contact-copy, .marketing-landing .marketing-contact-panel { padding: 32px 24px; }
}
@media (max-width: 575.98px) {
    .marketing-feature-grid { grid-template-columns: 1fr; gap: 14px; }
    .marketing-landing .marketing-feature-card { min-height: 0; }
    .marketing-landing .marketing-hero-actions { flex-direction: column; }
    .marketing-landing .marketing-hero-actions .btn { width: 100%; }
    .marketing-landing .marketing-hero-proof { gap: 10px 12px; font-size: .6rem; }
    .marketing-landing .marketing-pricing-grid .marketing-price-heading { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .marketing-landing *, .marketing-landing *::before, .marketing-landing *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
