:root{
  --bg:#fbf9f6;--card:#fffefc;--card-2:#fff9f2;--text:#2d231b;--muted:#7f7366;--line:#eadfd3;
  --primary:#c58a52;--primary-2:#e8c9a8;--accent:#ffe7ce;--good:#2e8b4d;
  --shadow:0 14px 38px rgba(81,56,29,.08);--shadow-sm:0 8px 24px rgba(81,56,29,.06);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;background:linear-gradient(180deg,#f8f5f1,#fbfaf8);color:var(--text)}
a{text-decoration:none;color:inherit}img,video{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 28px));margin:auto}
.site-wrap{padding-bottom:110px;position:relative;overflow:hidden}.bg-orb{position:absolute;border-radius:50%;filter:blur(18px);opacity:.26;pointer-events:none}.orb-1{width:260px;height:260px;background:#fee4ca;top:80px;right:-90px}.orb-2{width:210px;height:210px;background:#f8eee3;top:540px;left:-80px}.orb-3{width:220px;height:220px;background:#fff4dd;bottom:120px;right:40px}
.topbar{position:sticky;top:0;z-index:20;background:rgba(251,249,246,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:18px}.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand img{width:52px;height:52px;object-fit:contain;flex:none}.brand strong{display:block;font-size:15px}.brand span{display:block;color:var(--muted);font-size:12px}.desktop-nav{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.desktop-nav a{font-size:14px;color:#5c5249;position:relative}.desktop-nav a::after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:var(--primary);transition:.25s}.desktop-nav a:hover::after{width:100%}.header-cta-wrap{margin-left:auto;display:flex;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:16px;border:1px solid transparent;font-weight:800;transition:.24s ease;gap:8px;cursor:pointer}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--primary),#d7a06a);color:white;box-shadow:var(--shadow-sm)}.btn-secondary{background:#fff;border-color:var(--line);color:var(--text)}.pulse-btn{position:relative;overflow:hidden}.pulse-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transform:translateX(-120%);animation:shine 3s infinite}@keyframes shine{to{transform:translateX(120%)}}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#f2e5d8;color:#8b633b;font-weight:900;font-size:12px;letter-spacing:.05em;box-shadow:0 6px 18px rgba(163,116,62,.09)}.mini-status{color:#8d7a66;font-size:13px;font-weight:700}.mini-label{display:inline-flex;padding:8px 12px;border-radius:999px;background:#f5eadf;color:#947155;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.app-main{display:grid;gap:18px;padding-top:18px}.app-shell,.app-section-card{background:rgba(255,255,255,.84);border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow);padding:22px;position:relative}.soft-shine::before{content:"";position:absolute;inset:auto -15% 68% auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,#ffefdf,transparent 65%);pointer-events:none}
.app-topline{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}.hero-stack{display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:center}.hero-copy h1{font-size:52px;line-height:1.04;margin:0 0 14px;letter-spacing:-1.4px}.hero-copy p{font-size:18px;line-height:1.68;color:var(--muted);margin:0 0 16px;max-width:760px}.hero-inline-media{width:100%}.hero-image-shell{width:100%;border-radius:28px;overflow:hidden;border:1px solid rgba(197,138,82,.18);background:linear-gradient(180deg,#fff5ea,#f8ede3);box-shadow:0 20px 48px rgba(115,73,26,.12)}.hero-image-shell img{width:100%;aspect-ratio:4/4.15;object-fit:cover;opacity:.97}.floating-image{animation:floaty 5s ease-in-out infinite}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.app-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.app-kpi{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 12px;box-shadow:var(--shadow-sm)}.app-kpi strong{display:block;font-size:22px;margin-bottom:4px}.app-kpi span{display:block;color:var(--muted);font-size:13px}.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.quick-action-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.quick-action{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;border:1px solid var(--line);background:#fff}.qa-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#fff2e2,#f9e7d1);font-size:18px;flex:none}.quick-action strong{display:block;font-size:15px}.quick-action small{display:block;color:var(--muted);font-size:12px;line-height:1.4}
.section-title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:18px}.section-title-row h2{font-size:32px;margin:0}.section-title-row p{max-width:520px;color:var(--muted);margin:0}.section-title-row.compact{align-items:center}
.feature-grid-app{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-app-card,.pricing-app-card,.roi-box,.form-wrap,.form-promo,.card,.stat-card,.chart-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:18px}.hover-lift{transition:transform .26s ease,box-shadow .26s ease,border-color .26s ease}.hover-lift:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(81,56,29,.09);border-color:#e2c5a3}.card-icon{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,#fff2e2,#f9e7d1);font-size:22px;margin-bottom:12px}.feature-app-card h3,.pricing-app-card h3{margin:0 0 10px;font-size:21px}.feature-app-card p,.pricing-app-card li,.muted,.small{color:var(--muted);line-height:1.6}.small{font-size:12px}
.pricing-app-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.pricing-app-card.active{border-color:#d4a270;box-shadow:0 10px 28px rgba(197,138,82,.12)}.price-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}.price-top small{color:#9a7d5f;font-weight:900;letter-spacing:.03em}.price-top span{font-size:13px;color:#7f7366;background:#faf4ee;padding:7px 10px;border-radius:999px}.pricing-app-card ul{padding-left:18px;margin:12px 0 0}
.media-slider{position:relative}.slides{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(300px,1fr);overflow:auto;scroll-snap-type:x mandatory;gap:16px;padding-bottom:6px}.slide{scroll-snap-align:start;background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}.slide img,.slide video{width:100%;aspect-ratio:16/10;object-fit:cover;background:#f4efe9}.caption{padding:12px 14px;color:#6e6258;font-weight:600}.slider-btn{position:absolute;top:42%;transform:translateY(-50%);width:42px;height:42px;border:none;border-radius:50%;background:#fff;box-shadow:var(--shadow);cursor:pointer;z-index:2;color:#6f5942;font-size:20px}.slider-btn.prev{left:-8px}.slider-btn.next{right:-8px}
.form-grid{display:grid;gap:14px}.form-grid.two{grid-template-columns:repeat(2,1fr)}label{font-size:14px;font-weight:800;color:#6a5b4d;display:block}input,select,textarea{width:100%;margin-top:7px;padding:14px 15px;border-radius:14px;border:1px solid var(--line);background:#fff;font:inherit;color:#2c241d;transition:border-color .2s, box-shadow .2s}input:focus,select:focus,textarea:focus{outline:none;border-color:#d8a879;box-shadow:0 0 0 4px rgba(213,161,111,.12)}.align-end{align-items:end}.result-box{margin-top:14px;padding:16px 18px;border-radius:16px;background:#fff7ef;border:1px solid #eed7bf}
.app-register-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:18px}.app-promo{background:linear-gradient(180deg,#fffdf9,#fff8f0)}.app-promo h2{margin:10px 0 16px;font-size:34px;line-height:1.15}.promo-list{display:grid;gap:12px}.promo-item{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid #f1e3d2;border-radius:18px;background:#fffefc;transition:.25s}.promo-item:hover{transform:translateX(2px);box-shadow:var(--shadow-sm)}.promo-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#ffe9d0,#fff4e8);font-size:18px;flex:none}.promo-item strong{display:block;margin-bottom:4px}.promo-item small{display:block;color:var(--muted);line-height:1.5}.alert{padding:12px 14px;border-radius:14px;margin-bottom:12px}.alert.success{background:#edf8f1;border:1px solid #bee3cb;color:#2b7444}.alert.error{background:#fff1f1;border:1px solid #efc0c0;color:#b13636}.hp-field{position:absolute;left:-9999px;opacity:0}
.mobile-dock-nav{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:40;width:min(580px,calc(100% - 18px));display:flex;justify-content:space-between;gap:10px;padding:10px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:24px;box-shadow:0 18px 44px rgba(81,56,29,.14);backdrop-filter:blur(12px)}.mobile-dock-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:12px 10px;border-radius:18px;color:#5f5145;font-size:12px;font-weight:800}.mobile-dock-nav a span{font-size:18px}.mobile-dock-nav a.is-primary{background:linear-gradient(135deg,var(--primary),#d7a06a);color:#fff}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.in-view{opacity:1;transform:none}
/* CRM */
.crm-body{background:linear-gradient(180deg,#f8f5f1,#fbfaf8)}.crm-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.crm-sidebar{background:#fff;border-right:1px solid var(--line);padding:20px;position:sticky;top:0;height:100vh}.crm-main{padding:20px}.crm-userbox{padding:14px;border:1px solid var(--line);border-radius:18px;background:#fff}.crm-menu{display:grid;gap:8px;margin-top:18px}.crm-menu a{padding:12px 14px;border-radius:14px;color:#634f3a}.crm-menu a.active,.crm-menu a:hover{background:#f3e8dc;color:#9b6e43;font-weight:700}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat-card strong{display:block;font-size:28px;margin-bottom:6px}.toolbar,.filter-bar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:14px}.table-wrap{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:auto}.crm-table{width:100%;border-collapse:collapse}.crm-table th,.crm-table td{padding:12px 10px;border-bottom:1px solid #f1e6da;text-align:left;font-size:14px;vertical-align:top}.status-badge{display:inline-flex;padding:7px 10px;border-radius:999px;background:#f3ede6;font-weight:800;color:#7d5e42;font-size:12px}.status-Mới{background:#ecf7ff;color:#2777b6}.status-Đang\ xử\ lý{background:#fff3da;color:#a36a00}.status-Đã\ tư\ vấn{background:#eef5ff;color:#4a65b8}.status-Đã\ hẹn\ gặp{background:#efeaff;color:#6f57cb}.status-Đã\ báo\ giá{background:#fff1e6;color:#d46c00}.status-Đã\ chốt{background:#edf9ef;color:#2e8b4d}.status-Không\ phù\ hợp{background:#f4f4f4;color:#666}.status-Spam\ /\ Bot{background:#fff0f0;color:#c44343}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.dashboard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}.dashboard-sub{color:var(--muted);max-width:640px}.chart-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin:18px 0}.chart-card h3{margin:0 0 12px}.chart-host{width:100%;overflow:hidden}.chart-host svg{display:block;width:100%;height:auto}.chart-legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-size:13px}.dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:middle}.notify-bar{display:none;align-items:center;gap:10px;margin:0 0 14px;padding:13px 14px;background:#fff8ec;border:1px solid #f1d6b5;border-radius:16px;color:#8b5e29;font-weight:700}.notify-bar.show{display:flex;animation:toast .4s ease}@keyframes toast{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}.login-page{display:grid;place-items:center;min-height:100vh;padding:20px}.login-card{width:min(480px,100%);background:#fff;border:1px solid var(--line);border-radius:26px;padding:30px;box-shadow:var(--shadow)}
@media (max-width:1040px){.desktop-nav{display:none}.hero-stack,.app-register-grid,.crm-shell,.grid-2,.chart-grid{grid-template-columns:1fr}.feature-grid-app,.pricing-app-list{grid-template-columns:1fr 1fr}.app-kpis{grid-template-columns:1fr 1fr 1fr}.crm-sidebar{position:relative;height:auto}.stats{grid-template-columns:repeat(2,1fr)}.hero-copy h1{font-size:40px}}
@media (max-width:680px){.container{width:min(100%,calc(100% - 18px))}.site-wrap{padding-bottom:106px}.nav-row{gap:10px}.header-cta-wrap{margin-left:0}.header-cta{padding:10px 12px;font-size:13px;white-space:nowrap}.brand img{width:46px;height:46px}.brand strong{font-size:14px}.brand span{font-size:11px}.app-shell,.app-section-card{padding:16px;border-radius:24px}.app-topline{align-items:flex-start}.hero-stack{display:flex;flex-direction:column;align-items:stretch}.hero-copy h1{font-size:31px;line-height:1.12}.hero-copy p{font-size:15px}.hero-inline-media{order:2}.hero-image-shell{border-radius:22px}.hero-image-shell img{aspect-ratio:4/4.4}.app-kpis{grid-template-columns:repeat(3,1fr);gap:8px}.app-kpi{padding:12px 8px;border-radius:16px}.app-kpi strong{font-size:18px}.app-kpi span{font-size:11px;line-height:1.35}.quick-action-row,.feature-grid-app,.pricing-app-list,.stats{grid-template-columns:1fr}.roi-box .form-grid.two,.app-form-card .form-grid.two{grid-template-columns:repeat(2,1fr);gap:12px}.app-form-card label,.roi-box label{font-size:13px}.app-form-card input,.app-form-card select,.app-form-card textarea,.roi-box input{padding:12px 12px;font-size:14px}.section-title-row h2{font-size:26px}.section-title-row p{font-size:14px}.slider-btn{display:none}.slides{grid-auto-columns:90%}.cta-row{flex-direction:column}.cta-row .btn{width:100%}.app-promo h2{font-size:28px}.mobile-dock-nav a{padding:10px 8px;font-size:11px}.mobile-dock-nav a span{font-size:17px}.crm-main{padding:12px}.crm-table th,.crm-table td{font-size:13px}}
