/* ===================================================================
   E-COMMERCE ACCOUNTING landing (/ecommerce-accounting) — ported from
   alya-landing src/pages/Ecommerce.tsx. All markup is raw-HTML widgets,
   so these .ec-* classes are immune to Elementor's flex-container
   overrides. Self-contained; mobile-first with 768px / 1024px breaks.
   =================================================================== */
.ec { font-family:'Manrope',sans-serif; color:#021F4B; }
.ec *,.ec *::before,.ec *::after { box-sizing:border-box; }
.ec img { display:block; max-width:100%; }
.ec a { text-decoration:none; }
.ec-wrap { width:100%; max-width:1384px; margin:0 auto; padding:0 24px; }
@media (min-width:768px){ .ec-wrap { padding:0 32px; } }
.ec-wrap-5 { max-width:1024px; }

/* ── shared tokens ── */
.ec-eyebrow { font-size:11px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:#021F4B; display:inline-block; }
.ec-eyebrow-light { font-size:11px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:#7FFA7B; display:inline-block; }
.ec-gold { color:#7FFA7B; }
.ec-stars { display:inline-flex; gap:2px; color:#FBBC04; }
.ec-stars svg { width:14px; height:14px; fill:#FBBC04; }
.ec-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:#7FFA7B; color:#021F4B; font-weight:700; border:none; cursor:pointer; border-radius:9999px; transition:transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease; }
.ec-btn:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(127,250,123,0.25); color:#021F4B; }
.ec-btn svg { width:16px; height:16px; fill:#021F4B; }
.ec-btn-ghost { display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:9999px; border:1px solid #C8DAF2; color:rgba(2,31,75,0.6); font-weight:600; font-size:15px; padding:16px 28px; transition:border-color .2s ease; }
.ec-btn-ghost:hover { border-color:rgba(2,31,75,0.2); color:rgba(2,31,75,0.6); }

/* ── section heads (centered) ── */
.ec-sec { padding:80px 0; }
@media (min-width:1024px){ .ec-sec { padding:112px 0; } }
.ec-sec-light { background:#F4F8FD; }
.ec-sec-white { background:#fff; }
.ec-head-c { text-align:center; max-width:672px; margin:0 auto 56px; }
.ec-head-c .ec-eyebrow { margin-bottom:16px; }
.ec-h2 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; letter-spacing:-0.02em; font-size:clamp(28px,4vw,44px); line-height:1.15; margin:0; }
.ec-sub { color:#5A7090; font-size:16px; line-height:1.6; margin:16px auto 0; max-width:576px; }

/* ── Hero ── */
.ec-hero { position:relative; overflow:hidden; background:#fff; padding:64px 0; }
@media (min-width:1024px){ .ec-hero { padding:96px 0; } }
.ec-hero-glow-a { position:absolute; top:-15%; right:-5%; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle, rgba(127,250,123,0.07) 0%, transparent 70%); pointer-events:none; }
.ec-hero-glow-b { position:absolute; bottom:-10%; left:-5%; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle, rgba(2,31,75,0.04) 0%, transparent 70%); pointer-events:none; }
.ec-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1fr; gap:48px; align-items:center; }
@media (min-width:1024px){ .ec-hero-grid { grid-template-columns:1fr 1fr; gap:64px; } }
.ec-hero-eyebrow { margin-bottom:20px; }
.ec-h1 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; line-height:1.1; letter-spacing:-0.03em; font-size:clamp(34px,6vw,54px); margin:0 0 24px; }
.ec-hero-lead { color:#5A7090; font-size:18px; line-height:1.6; margin:0 0 24px; max-width:500px; }
.ec-rating-badge { display:inline-flex; align-items:center; gap:12px; background:#fff; border:1px solid #C8DAF2; border-radius:9999px; padding:12px 20px; box-shadow:0 1px 2px rgba(2,31,75,0.05); margin-bottom:32px; }
.ec-rating-badge img { height:20px; width:auto; }
.ec-rating-badge .ec-div { width:1px; height:16px; background:#C8DAF2; }
.ec-rating-badge .ec-stars svg { width:14px; height:14px; }
.ec-rating-badge b { font-weight:700; color:#021F4B; font-size:14px; }
.ec-rating-badge span { color:#5A7090; font-size:13px; }
.ec-hero-cta { display:flex; flex-direction:column; gap:12px; margin-bottom:48px; }
@media (min-width:640px){ .ec-hero-cta { flex-direction:row; } }
.ec-hero-cta .ec-btn { padding:16px 28px; font-size:15px; }

/* hero dashboard card */
.ec-hero-cardwrap { display:flex; align-items:center; justify-content:center; }
.ec-card { position:relative; width:100%; max-width:420px; margin:0 auto; padding-bottom:24px; }
@media (min-width:1024px){ .ec-card { padding-bottom:0; } }
.ec-card-inner { border-radius:16px; border:1px solid #C8DAF2; background:#fff; box-shadow:0 24px 80px rgba(2,31,75,0.10); padding:32px; }
.ec-card-head { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.ec-card-head .ec-card-ico { width:40px; height:40px; border-radius:50%; background:#7FFA7B; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ec-card-head .ec-card-ico svg { width:20px; height:20px; color:#021F4B; }
.ec-card-head .ec-card-t { font-weight:700; color:#021F4B; font-size:15px; margin:0; }
.ec-card-head .ec-card-s { color:#5A7090; font-size:13px; margin:0; }
.ec-card-rows { margin-bottom:20px; }
.ec-card-row { display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid rgba(200,218,242,0.5); }
.ec-card-row:last-child { border-bottom:none; }
.ec-card-row .ec-cr-l { display:flex; align-items:center; gap:10px; }
.ec-card-row .ec-cr-dot { width:8px; height:8px; border-radius:50%; background:#7FFA7B; flex-shrink:0; }
.ec-card-row .ec-cr-label { color:#021F4B; font-size:14px; font-weight:500; }
.ec-card-row .ec-cr-r { display:flex; align-items:center; gap:8px; }
.ec-card-row .ec-cr-val { color:#5A7090; font-size:13px; font-weight:600; }
.ec-card-row .ec-cr-r svg { width:20px; height:20px; color:#7FFA7B; flex-shrink:0; }
.ec-card-foot { padding:12px; border-radius:12px; background:#F4F8FD; text-align:center; }
.ec-card-foot p { font-size:12px; font-weight:600; color:#7FFA7B; text-transform:uppercase; letter-spacing:0.05em; margin:0; }
.ec-badge-tr { position:absolute; top:-16px; right:-16px; background:#021F4B; color:#fff; border-radius:12px; padding:8px 12px; box-shadow:0 8px 24px rgba(2,31,75,0.2); }
.ec-badge-tr .ec-bt1 { font-size:11px; font-weight:700; color:#7FFA7B; margin:0; }
.ec-badge-tr .ec-bt2 { font-size:11px; color:rgba(255,255,255,0.6); margin:0; }
.ec-badge-bl { position:absolute; bottom:-8px; left:-16px; background:#fff; border:1px solid #C8DAF2; border-radius:12px; padding:12px 16px; box-shadow:0 8px 24px rgba(2,31,75,0.12); }
.ec-badge-bl .ec-bb1 { font-size:11px; color:#5A7090; margin:0 0 2px; }
.ec-badge-bl .ec-bb2 { font-size:18px; font-weight:700; color:#021F4B; margin:0; }
.ec-badge-bl .ec-bb2 small { font-size:13px; font-weight:400; color:#5A7090; }

/* ── Marquee (reuses .marquee-track/.marquee-item/.gold-dot) ── */
.ec-marquee { overflow:hidden; padding:20px 0; user-select:none; background:#F4F8FD; border-top:1px solid #C8DAF2; border-bottom:1px solid #C8DAF2; }
.ec-marquee .marquee-item { gap:32px; padding:0 32px; }
.ec-marquee img { height:40px; width:auto; object-fit:contain; }

/* ── Problem & Solution ── */
.ec-ps-grid { display:grid; grid-template-columns:1fr; gap:48px; align-items:start; }
@media (min-width:1024px){ .ec-ps-grid { grid-template-columns:1fr 1fr; gap:80px; } }
.ec-ps-left .ec-eyebrow { margin-bottom:16px; }
.ec-ps-h2 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; letter-spacing:-0.02em; line-height:1.15; font-size:clamp(28px,4vw,42px); margin:0 0 24px; }
.ec-ps-lead { color:#5A7090; font-size:17px; line-height:1.6; margin:0 0 32px; }
.ec-pain-list { display:flex; flex-direction:column; gap:12px; }
.ec-pain { display:flex; align-items:flex-start; gap:12px; }
.ec-pain-mark { width:20px; height:20px; border-radius:50%; border:2px solid #C8DAF2; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px; }
.ec-pain-mark span { width:8px; height:8px; border-radius:50%; background:#C8DAF2; }
.ec-pain p { color:#5A7090; font-size:15px; line-height:1.6; margin:0; }
.ec-sol { border-radius:16px; background:#021F4B; padding:32px; }
@media (min-width:1024px){ .ec-sol { padding:40px; } }
.ec-sol-ico { width:44px; height:44px; border-radius:12px; background:rgba(127,250,123,0.1); display:flex; align-items:center; justify-content:center; margin-bottom:24px; }
.ec-sol-ico svg { width:24px; height:24px; color:#7FFA7B; }
.ec-sol .ec-eyebrow-light { margin-bottom:16px; }
.ec-sol h3 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#fff; line-height:1.2; letter-spacing:-0.02em; font-size:clamp(22px,3vw,28px); margin:0 0 16px; }
.ec-sol > p { color:rgba(255,255,255,0.55); font-size:16px; line-height:1.6; margin:0 0 32px; }
.ec-sol-list { display:flex; flex-direction:column; gap:12px; }
.ec-sol-li { display:flex; align-items:center; gap:12px; }
.ec-sol-li svg { width:16px; height:16px; color:#7FFA7B; flex-shrink:0; }
.ec-sol-li span { color:rgba(255,255,255,0.7); font-size:14px; }
.ec-sol .ec-btn { margin-top:32px; padding:12px 24px; font-size:14px; }

/* ── Why Choose ── */
.ec-why-grid { display:grid; grid-template-columns:1fr; gap:24px; }
@media (min-width:768px){ .ec-why-grid { grid-template-columns:repeat(2,1fr); } }
.ec-why-card { border-radius:16px; border:1px solid #C8DAF2; background:#fff; padding:28px; transition:box-shadow .3s ease, border-color .3s ease; }
.ec-why-card:hover { box-shadow:0 12px 40px rgba(2,31,75,0.08); border-color:rgba(127,250,123,0.3); }
.ec-why-top { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.ec-why-ico { width:44px; height:44px; border-radius:12px; background:#021F4B; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ec-why-ico svg { width:20px; height:20px; color:#7FFA7B; }
.ec-why-tag { color:#7FFA7B; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; }
.ec-why-card h3 { font-weight:700; color:#021F4B; font-size:18px; line-height:1.35; margin:0 0 12px; }
.ec-why-card p { color:#5A7090; font-size:14px; line-height:1.6; margin:0; }

/* ── Services ── */
.ec-svc-grid { display:grid; grid-template-columns:1fr; gap:20px; }
@media (min-width:768px){ .ec-svc-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .ec-svc-grid { grid-template-columns:repeat(3,1fr); } }
.ec-svc-card { border-radius:12px; border:1px solid #C8DAF2; background:#F4F8FD; padding:24px; transition:border-color .3s ease, box-shadow .3s ease; }
.ec-svc-card:hover { border-color:rgba(127,250,123,0.4); box-shadow:0 8px 32px rgba(127,250,123,0.07); }
.ec-svc-ico { width:40px; height:40px; border-radius:8px; background:#021F4B; display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.ec-svc-ico svg { width:20px; height:20px; color:#7FFA7B; }
.ec-svc-card h3 { font-weight:700; color:#021F4B; font-size:16px; margin:0 0 8px; }
.ec-svc-card p { color:#5A7090; font-size:13px; line-height:1.6; margin:0; }

/* ── Platforms ── */
.ec-plat-head { text-align:center; max-width:672px; margin:0 auto 64px; }
.ec-plat-head .ec-eyebrow { margin-bottom:16px; }
.ec-plat-head h2 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; letter-spacing:-0.025em; line-height:1.12; font-size:clamp(28px,4vw,42px); margin:0; }
.ec-plat-head p { color:#5A7090; font-size:16px; line-height:1.6; margin:16px auto 0; max-width:576px; }
.ec-plat-group { margin-bottom:56px; }
.ec-plat-rule { display:flex; align-items:center; gap:8px; margin-bottom:32px; }
.ec-plat-rule .ec-line { height:1px; flex:1; background:#E8F0FA; }
.ec-plat-rule span { color:#5A7090; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.18em; padding:0 16px; white-space:nowrap; }
.ec-plat-logos { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:32px 40px; }
.ec-plat-logos img { height:32px; width:auto; object-fit:contain; opacity:0.7; filter:grayscale(1); transition:opacity .2s ease, filter .2s ease; }
.ec-plat-logos img:hover { opacity:1; filter:grayscale(0); }
.ec-plat-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; padding-top:56px; border-top:1px solid #C8DAF2; }
@media (min-width:768px){ .ec-plat-stats { grid-template-columns:repeat(4,1fr); } }
.ec-plat-stat { text-align:center; }
.ec-plat-stat .ec-pv { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; letter-spacing:-0.03em; font-size:clamp(34px,5vw,48px); line-height:1; margin:0 0 4px; }
.ec-plat-stat .ec-pl { color:#5A7090; font-size:14px; margin:0; }

/* ── Testimonials ── */
.ec-test-grid { display:grid; grid-template-columns:1fr; gap:24px; }
@media (min-width:768px){ .ec-test-grid { grid-template-columns:repeat(2,1fr); } }
.ec-test-card { border-radius:16px; border:1px solid #C8DAF2; background:#fff; padding:32px; }
.ec-test-card .ec-stars { margin-bottom:20px; gap:4px; color:#7FFA7B; }
.ec-test-card .ec-stars svg { width:16px; height:16px; fill:#7FFA7B; }
.ec-test-card blockquote { color:#021F4B; font-size:16px; line-height:1.6; font-style:italic; margin:0 0 24px; }
.ec-test-card .ec-test-author { font-weight:700; color:#021F4B; font-size:14px; margin:0; }
.ec-test-card .ec-test-co { color:#5A7090; font-size:13px; margin:0; }

/* ── FAQ ── */
.ec-faq-grid { display:grid; grid-template-columns:1fr; gap:48px; }
@media (min-width:1024px){ .ec-faq-grid { grid-template-columns:1fr 1fr; gap:80px; } }
.ec-faq-left .ec-eyebrow { margin-bottom:16px; }
.ec-faq-left h2 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#021F4B; line-height:1.2; letter-spacing:-0.02em; font-size:clamp(28px,4vw,40px); margin:0 0 24px; }
.ec-faq-left p { color:#5A7090; font-size:17px; line-height:1.6; margin:0 0 32px; }
.ec-faq-link { display:inline-flex; align-items:center; gap:8px; color:#021F4B; font-weight:700; font-size:14px; }
.ec-faq-link svg { width:16px; height:16px; fill:#021F4B; }
.ec-faq-box { background:#F4F8FD; border-radius:16px; border:1px solid #C8DAF2; padding:8px 24px; }
.ec-faq-item { border-bottom:1px solid #C8DAF2; }
.ec-faq-item:last-child { border-bottom:none; }
.ec-faq-item summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 0; font-weight:600; color:#021F4B; font-size:15px; line-height:1.3; }
.ec-faq-item summary::-webkit-details-marker { display:none; }
.ec-faq-item summary svg { width:20px; height:20px; color:#5A7090; flex-shrink:0; transition:transform .2s ease; }
.ec-faq-item[open] summary svg { transform:rotate(180deg); }
.ec-faq-item .ec-faq-a { padding:0 0 20px; color:#5A7090; font-size:15px; line-height:1.6; margin:0; }

/* ── Lead form (navy) ── */
.ec-lead { background:#021F4B; padding:80px 0; }
@media (min-width:1024px){ .ec-lead { padding:112px 0; } }
.ec-lead-grid { display:grid; grid-template-columns:1fr; gap:48px; align-items:start; }
@media (min-width:1024px){ .ec-lead-grid { grid-template-columns:1fr 1fr; gap:80px; } }
.ec-lead-info .ec-eyebrow-light { margin-bottom:16px; }
.ec-lead-info h2 { font-family:'PP Neue Montreal','Manrope',sans-serif; font-weight:800; color:#fff; line-height:1.15; letter-spacing:-0.02em; font-size:clamp(28px,4vw,44px); margin:0 0 24px; }
.ec-lead-info > p { color:rgba(255,255,255,0.5); font-size:17px; line-height:1.6; margin:0 0 40px; }
.ec-lead-trust { display:flex; flex-direction:column; gap:16px; }
.ec-lead-trust-item { display:flex; align-items:center; gap:12px; }
.ec-lead-trust-item .ec-lt-ico { width:32px; height:32px; border-radius:8px; background:rgba(255,255,255,0.05); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ec-lead-trust-item .ec-lt-ico svg { width:16px; height:16px; color:#7FFA7B; }
.ec-lead-trust-item span { color:rgba(255,255,255,0.6); font-size:14px; }
.ec-lead-form { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1); border-radius:16px; padding:28px; }
.ec-form-row { display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:16px; }
@media (min-width:640px){ .ec-form-row { grid-template-columns:repeat(2,1fr); } }
.ec-field { margin-bottom:16px; }
.ec-field label { display:block; font-size:13px; font-weight:500; color:rgba(255,255,255,0.6); margin-bottom:6px; }
.ec-input { width:100%; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:12px; color:#fff; font-size:15px; padding:12px 16px; font-family:'Manrope',sans-serif; transition:border-color .2s ease; }
.ec-input::placeholder { color:rgba(255,255,255,0.25); }
.ec-input:focus { outline:none; border-color:rgba(127,250,123,0.5); }
select.ec-input { background:#021F4B; color:#fff; }
select.ec-input option { background:#021F4B; color:#fff; }
.ec-lead-form .ec-btn { width:100%; padding:16px; font-size:15px; margin-top:8px; }
.ec-form-note { color:rgba(255,255,255,0.25); font-size:12px; text-align:center; line-height:1.6; margin:12px 0 0; }
.ec-form-success { text-align:center; padding:40px; }
.ec-form-success .ec-check { width:56px; height:56px; border-radius:50%; background:rgba(127,250,123,0.1); display:flex; align-items:center; justify-content:center; margin:0 auto 20px; }
.ec-form-success .ec-check svg { width:28px; height:28px; color:#7FFA7B; }
.ec-form-success h3 { font-weight:700; color:#fff; font-size:20px; margin:0 0 12px; }
.ec-form-success p { color:rgba(255,255,255,0.5); font-size:15px; line-height:1.6; margin:0; }

/* ── Elementor override guard (see note: .elementor img beats .ec-* img) ── */
.ec-rating-badge img { height:20px !important; width:auto !important; max-width:none !important; }
.ec-marquee img { height:40px !important; width:auto !important; max-width:none !important; }
.ec-plat-logos img { height:32px !important; width:auto !important; max-width:none !important; }