.odookade-home {
    --bg: #FFFFFF;
    --surface-alt: #FAF7FA;
    --ink: #1C1720;
    --ink-secondary: #6A6478;
    --border: #ECE5EC;
    --border-strong: #DCD1DC;

    --accent: #6E236E;
    --accent-2: #C43D8F;
    --accent-soft: #F5EAF4;
    --gold: #C68A2E;
    --gold-soft: #FBF1DF;
    --green: #379A5C;
    --green-soft: #E7F6ED;
    --gradient-brand: linear-gradient(135deg, #6E236E, #C43D8F);

    --shadow: 0 24px 60px -24px rgba(110, 35, 110, 0.24);
    --shadow-sm: 0 14px 34px -18px rgba(28, 23, 32, 0.14);
}.odookade-home * { margin:0; padding:0; box-sizing:border-box; }.odookade-home {
    width:100%; max-width:100vw; overflow-x:hidden !important;
    font-family:'Vazirmatn', sans-serif;
    background-color: var(--bg); color: var(--ink);
    line-height:1.75;
}.odookade-home button, .odookade-home input, .odookade-home textarea, .odookade-home select, .odookade-home a { font-family:'Vazirmatn', sans-serif; }.odookade-home h1, .odookade-home h2, .odookade-home h3, .odookade-home h4, .odookade-home h5, .odookade-home h6, .odookade-home p, .odookade-home span, .odookade-home div, .odookade-home li, .odookade-home label, .odookade-home strong, .odookade-home em, .odookade-home small { font-family:'Vazirmatn', sans-serif; }.odookade-home .en-text, .odookade-home .en-text * { font-family:'Poppins', sans-serif !important; }
@media (pointer:fine){.odookade-home * { cursor:none !important; } }.odookade-home .en-text { font-family:'Poppins', sans-serif !important; direction:ltr; display:inline-block; }.odookade-home .font-bold { font-weight:700; }.odookade-home a { text-decoration:none; color:inherit; }.odookade-home ul { list-style:none; }.odookade-home img { max-width:100%; display:block; }.odookade-home .container { width:100%; max-width:1240px; margin:0 auto; padding:0 6%; }.odookade-home .section { padding:130px 0; overflow:hidden; }.odookade-home .section-title { font-size:clamp(2rem, 3.4vw, 2.75rem); font-weight:800; margin-bottom:22px; text-align:center; letter-spacing:-0.01em; }.odookade-home .section-subtitle { text-align:center; font-size:1.05rem; margin-bottom:64px; color: var(--ink-secondary); max-width:600px; margin-left:auto; margin-right:auto; }.odookade-home .text-muted { color: var(--ink-secondary); font-size:.9rem; }.odookade-home .mb-4 { margin-bottom:1.5rem; }.odookade-home .mt-4 { margin-top:1.5rem; }.odookade-home .w-100 { width:100%; }.odookade-home .gradient-text { background: var(--gradient-brand); -webkit-background-clip:text; -webkit-text-fill-color:transparent; display:inline-block; }.odookade-home .scroll-progress { position:fixed; top:0; right:0; height:3px; width:0%; background: var(--gradient-brand); z-index:1002; transition: width .1s ease; }.odookade-home .cursor-dot, .odookade-home .cursor-outline { position:fixed; top:0; left:0; transform:translate(-50%,-50%); border-radius:50%; z-index:1001; pointer-events:none; }.odookade-home .cursor-dot { width:6px; height:6px; background-color: var(--accent); }.odookade-home .cursor-outline { width:36px; height:36px; border:1px solid var(--border-strong); transition: width .2s, height .2s, background-color .2s, border-color .2s; }/* ---------- Header ---------- */
.odookade-home .header {
    position:fixed; top:18px; left:50%; transform:translateX(-50%);
    width:92%; max-width:1080px; background: rgba(255,255,255,.82);
    backdrop-filter: blur(16px); border:1px solid var(--border);
    border-radius:40px; z-index:100; box-shadow: var(--shadow-sm);
}.odookade-home .nav-container { display:flex; justify-content:space-between; align-items:center; height:68px; padding:0 28px; }.odookade-home .logo { font-size:1.4rem; font-family:'Poppins', sans-serif !important; font-weight:800; color: var(--ink); }.odookade-home .nav-links { display:flex; gap:28px; }.odookade-home .nav-item { font-weight:600; font-size:.92rem; color: var(--ink-secondary); position:relative; padding:5px 0; transition: color .25s; }.odookade-home .nav-item:hover { color: var(--accent); }.odookade-home .header-actions { display:flex; align-items:center; gap:14px; }.odookade-home .mobile-menu-btn { display:none; background:none; border:none; color: var(--ink); font-size:1.4rem; cursor:pointer; }.odookade-home .mobile-menu {
    position:fixed; top:0; right:-100%; width:300px; height:100vh;
    background:#fff; z-index:200; padding:40px 30px;
    transition: right .4s cubic-bezier(.77,0,.175,1); border-left:1px solid var(--border);
    box-shadow: var(--shadow);
}.odookade-home .mobile-menu.active { right:0; }.odookade-home .mobile-menu-overlay { position:fixed; top:0; left:0; width:100%; height:100vh; background:rgba(23,19,31,.35); z-index:190; opacity:0; visibility:hidden; transition:all .4s; }.odookade-home .mobile-menu-overlay.active { opacity:1; visibility:visible; }.odookade-home .close-menu-btn { position:absolute; top:25px; left:25px; background:none; border:none; color: var(--ink); font-size:1.4rem; cursor:pointer; }.odookade-home .mobile-nav-links { display:flex; flex-direction:column; gap:18px; margin-top:40px; }.odookade-home .mobile-nav-item { font-size:1.1rem; font-weight:600; display:block; padding-bottom:10px; border-bottom:1px solid var(--border); color: var(--ink); }/* ---------- Buttons ---------- */
.odookade-home .btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:13px 28px; border-radius:30px; font-weight:700; font-size:.98rem; transition:all .3s ease; border:1.5px solid transparent; cursor:pointer; }.odookade-home .btn-glow { background:#fff; color: var(--accent); border-color: var(--accent); }.odookade-home .btn-glow:hover { background: var(--accent-soft); }.odookade-home .btn-primary { background: var(--gradient-brand); color:#fff; box-shadow: var(--shadow-sm); }.odookade-home .btn-primary:hover { transform: translateY(-2px); box-shadow: var(--shadow); }.odookade-home .btn-large { padding:16px 32px; font-size:1.02rem; }/* ---------- Hero (centered, distinct from side-split layouts) ---------- */
.odookade-home .hero { min-height:96vh; display:flex; flex-direction:column; justify-content:center; padding-top:150px; padding-bottom:40px; position:relative; }.odookade-home .hero .container { text-align:center; max-width:900px; }.odookade-home .badge { display:inline-flex; align-items:center; gap:10px; padding:8px 18px; border-radius:20px; background: var(--accent-soft); border:1px solid rgba(76,29,149,.14); color: var(--accent); font-size:.85rem; font-weight:600; margin-bottom:26px; }.odookade-home .pulse-dot { width:7px; height:7px; background: var(--gold); border-radius:50%; box-shadow:0 0 8px rgba(169,130,47,.6); animation: odk-pulse 2s infinite; }
@keyframes odk-pulse{ 0%,100%{ transform:scale(.9); opacity:1; } 70%{ transform:scale(1.15); opacity:.6; } }.odookade-home .name { font-size:clamp(2.4rem, 5.4vw, 4.4rem); font-weight:800; line-height:1.22; margin-bottom:18px; letter-spacing:-0.02em; }.odookade-home .role { font-size:clamp(1.3rem, 2.2vw, 1.7rem); font-weight:600; color: var(--ink-secondary); margin-bottom:26px; min-height:44px; }.odookade-home .cursor { color: var(--accent); animation: odk-blink 1s infinite; }
@keyframes odk-blink{ 50%{ opacity:0; } }.odookade-home .bio { font-size:1.08rem; color: var(--ink-secondary); margin-bottom:40px; max-width:600px; margin-left:auto; margin-right:auto; }.odookade-home .highlight-bg { background: var(--accent-soft); padding:0 8px; border-radius:6px; color: var(--accent); font-weight:600; }.odookade-home .hero-buttons { display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; }/* ---------- 3D cube showcase ---------- */
/* ---------- Dynamic ERP showcase (replaces the old spinning cubes) ---------- */
.odookade-home .erp-showcase { position:relative; height:430px; margin-top:70px; max-width:760px; margin-left:auto; margin-right:auto; transform-style:preserve-3d; transition: transform .2s ease-out; }.odookade-home .showcase-card {
    position:absolute; background:#fff; border:1px solid var(--border); border-radius:20px;
    box-shadow: var(--shadow); padding:20px; text-align:right;
}.odookade-home .showcase-card-head { display:flex; align-items:center; gap:8px; font-size:.82rem; font-weight:700; color: var(--ink-secondary); margin-bottom:14px; }.odookade-home .showcase-card-head i { color: var(--accent); }.odookade-home .pipeline-card { top:0; right:0; width:400px; transform: rotate(-2deg); z-index:2; }.odookade-home .pipeline-cols { display:flex; gap:10px; }.odookade-home .pipeline-col { flex:1; background: var(--surface-alt); border-radius:12px; padding:10px 8px; min-height:120px; }.odookade-home .pipeline-col-title { display:block; font-size:.7rem; color: var(--ink-secondary); font-weight:700; margin-bottom:8px; text-align:center; }.odookade-home .pipeline-chip {
    background:#fff; border:1px solid var(--border); border-radius:10px; padding:8px 9px; font-size:.72rem;
    display:flex; flex-direction:column; gap:3px; box-shadow:0 4px 10px -6px rgba(23,19,31,.2); transition: transform .25s;
}.odookade-home .pipeline-chip:hover { transform: translateY(-3px); }.odookade-home .pipeline-chip b { font-size:.72rem; color: var(--accent); }.odookade-home .pipeline-chip + .pipeline-chip { margin-top:8px; }.odookade-home .pipeline-chip.pulse { animation: odk-chip-pulse 2.4s ease-in-out infinite; }.odookade-home .pipeline-chip.won { border-color: var(--gold); }.odookade-home .pipeline-chip.won b { color: var(--gold); }
@keyframes odk-chip-pulse{ 0%,100%{ box-shadow:0 4px 10px -6px rgba(23,19,31,.2); } 50%{ box-shadow:0 4px 16px -4px rgba(76,29,149,.45); } }.odookade-home .gantt-card { bottom:10px; left:0; width:300px; transform: rotate(2deg); z-index:3; }.odookade-home .gantt-rows { display:flex; flex-direction:column; gap:12px; }.odookade-home .gantt-row { display:flex; align-items:center; gap:10px; }.odookade-home .gantt-row span { font-size:.72rem; color: var(--ink-secondary); width:64px; flex-shrink:0; }.odookade-home .gantt-row .gantt-track { flex:1; height:8px; border-radius:6px; background: var(--surface-alt); overflow:hidden; }.odookade-home .gantt-bar { height:100%; border-radius:6px; background: var(--gradient-brand); }.odookade-home .gantt-bar.gold { background: linear-gradient(135deg,#D4AF6A,#A9822F); }.odookade-home .gantt-bar.bar-anim { animation: odk-gantt-grow 5s ease-in-out infinite alternate; }
@keyframes odk-gantt-grow{ from{ width:35%; } to{ width:68%; } }.odookade-home .stat-float-card { top:60px; left:-10px; width:170px; z-index:4; display:flex; align-items:center; gap:12px; padding:16px; transform: rotate(-3deg); }.odookade-home .warehouse-card { bottom:-30px; right:50px; width:220px; z-index:5; transform: rotate(3deg); }.odookade-home .mw-bars.small { height:56px; gap:8px; }.odookade-home .stat-float-card .gear-icon { font-size:1.6rem; color: var(--gold); animation: odk-gear-spin 8s linear infinite; flex-shrink:0; }.odookade-home .stat-float-card b { display:block; font-size:1.3rem; font-weight:800; color: var(--accent); font-family:'Poppins', sans-serif !important; }.odookade-home .stat-float-card span { font-size:.72rem; color: var(--ink-secondary); }
@keyframes odk-gear-spin{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } }

@media (max-width: 860px){.odookade-home .erp-showcase { height:auto; display:flex; flex-direction:column; gap:16px; align-items:center; max-width:340px; }.odookade-home .showcase-card, .odookade-home .pipeline-card, .odookade-home .gantt-card, .odookade-home .stat-float-card, .odookade-home .warehouse-card { position:static; width:100% !important; transform:none !important; }
}/* ---------- Header login link ---------- */
.odookade-home .login-link { display:inline-flex; align-items:center; gap:7px; font-size:.9rem; font-weight:600; color: var(--ink-secondary); transition: color .25s; }.odookade-home .login-link:hover { color: var(--accent); }.odookade-home .login-link i { font-size:.85rem; }/* ---------- Process steps ---------- */
.odookade-home .process-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; }.odookade-home .process-steps::before {
    content:''; position:absolute; top:28px; right:12.5%; left:12.5%; height:1px; background: var(--border-strong);
    z-index:0;
}.odookade-home .process-step { position:relative; z-index:1; text-align:center; padding:0 14px; }.odookade-home .process-num {
    width:56px; height:56px; border-radius:50%; background:#fff; border:1.5px solid var(--accent);
    color: var(--accent); font-family:'Poppins', sans-serif !important; font-weight:800; font-size:1.1rem;
    display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
}.odookade-home .process-step h4 { font-size:1rem; margin-bottom:8px; }.odookade-home .process-step p { color: var(--ink-secondary); font-size:.86rem; line-height:1.8; }
@media (max-width:768px){.odookade-home .process-steps { grid-template-columns:1fr; gap:36px; }.odookade-home .process-steps::before { display:none; }
}.odookade-home .stats-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }.odookade-home .stat-cell {
    background:#fff; border:1px solid var(--border); border-radius:20px; text-align:center; padding:34px 18px;
    transition: transform .35s, box-shadow .35s, border-color .35s;
}.odookade-home .stat-cell:hover { transform: translateY(-5px); box-shadow: var(--shadow-sm); border-color: var(--border-strong); }.odookade-home .stat-cell b { display:block; font-size:2.3rem; font-weight:800; color: var(--accent); font-family:'Poppins', sans-serif !important; margin-bottom:8px; }.odookade-home .stat-cell span { color: var(--ink-secondary); font-size:.86rem; }.odookade-home .stats-strip-3col { grid-template-columns:repeat(3,1fr) !important; }
@media (max-width:768px){.odookade-home .stats-strip { grid-template-columns:repeat(2,1fr); }.odookade-home .stats-strip-3col { grid-template-columns:1fr !important; }
}/* ---------- Explainer (Odoo چیست) ---------- */
.odookade-home .explainer-grid { display:grid; grid-template-columns: 1.1fr 0.9fr; gap:64px; align-items:center; }.odookade-home .explainer-text h2 { font-size:2.2rem; font-weight:800; margin-bottom:22px; line-height:1.35; text-align:right; letter-spacing:-0.01em; }.odookade-home .explainer-text p { color: var(--ink-secondary); font-size:1.02rem; line-height:2; margin-bottom:18px; }.odookade-home .explainer-text ul { display:flex; flex-direction:column; gap:14px; margin-top:22px; }.odookade-home .explainer-text ul li { display:flex; align-items:flex-start; gap:10px; font-size:.96rem; color: var(--ink); }.odookade-home .explainer-text ul li i { color: var(--gold); margin-top:4px; }.odookade-home .app-icon-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.odookade-home .app-icon-cell { background:#fff; border:1px solid var(--border); border-radius:18px; padding:24px 12px; text-align:center; transition: transform .3s, box-shadow .3s, border-color .3s; }.odookade-home .app-icon-cell:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); border-color: var(--border-strong); }.odookade-home .app-icon-cell i { font-size:1.4rem; color: var(--accent); margin-bottom:10px; display:block; }.odookade-home .app-icon-cell span { font-size:.78rem; color: var(--ink-secondary); }/* ---------- Mini live-mockup widgets (Odoo explainer) ---------- */
.odookade-home .mini-widget-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.odookade-home .mini-widget {
    background:#fff; border:1px solid var(--border); border-radius:20px; padding:18px;
    transition: transform .35s, box-shadow .35s, border-color .35s;
}.odookade-home .mini-widget:hover { transform: translateY(-5px); box-shadow: var(--shadow-sm); border-color: var(--border-strong); }.odookade-home .mini-widget-head { display:flex; align-items:center; gap:8px; font-size:.82rem; font-weight:700; color: var(--ink); margin-bottom:14px; }.odookade-home .mini-widget-head i { color: var(--accent); }.odookade-home .mw-kanban { display:flex; gap:8px; }.odookade-home .mw-kanban .mw-col { flex:1; background: var(--surface-alt); border-radius:10px; padding:8px; min-height:70px; }.odookade-home .mw-kanban .mw-chip { background:#fff; border:1px solid var(--border); border-radius:8px; padding:7px 8px; font-size:.68rem; margin-bottom:6px; box-shadow:0 3px 8px -5px rgba(28,23,32,.25); }.odookade-home .mw-kanban .mw-chip.pulse { animation: odk-chip-pulse 2.4s ease-in-out infinite; }.odookade-home .mw-bars { display:flex; align-items:flex-end; gap:10px; height:80px; }.odookade-home .mw-bars .mw-bar { flex:1; border-radius:8px 8px 0 0; background: linear-gradient(180deg,#8B3D8B,#6E236E); }.odookade-home .mw-bars .mw-bar.grow { animation: odk-bar-grow 4s ease-in-out infinite alternate; }
@keyframes odk-bar-grow{ from{ height:35%; } to{ height:85%; } }.odookade-home .mw-invoice { background: var(--surface-alt); border-radius:12px; padding:14px; }.odookade-home .mw-invoice .mw-row { display:flex; justify-content:space-between; font-size:.72rem; color: var(--ink-secondary); margin-bottom:8px; }.odookade-home .mw-invoice .mw-total { display:flex; justify-content:space-between; font-weight:800; font-size:.88rem; color: var(--ink); padding-top:8px; border-top:1px dashed var(--border-strong); }.odookade-home .mw-stamp { display:inline-flex; align-items:center; gap:5px; color: var(--green); font-size:.7rem; font-weight:700; margin-top:8px; animation: odk-chip-pulse 2.6s ease-in-out infinite; }/* ---------- Why-ERP section ---------- */
.odookade-home .why-erp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }.odookade-home .why-erp-card { text-align:center; padding:36px 22px; }.odookade-home .why-erp-icon { width:56px; height:56px; border-radius:16px; background: var(--accent-soft); color: var(--accent); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin:0 auto 20px; }.odookade-home .why-erp-card h3 { font-size:1.08rem; margin-bottom:10px; }.odookade-home .why-erp-card p { color: var(--ink-secondary); font-size:.9rem; line-height:1.8; }/* ---------- Modules-by-department ---------- */
.odookade-home .dept-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.odookade-home .dept-card { background:#fff; border:1px solid var(--border); border-radius:22px; padding:30px; transition: transform .35s, box-shadow .35s, border-color .35s; }.odookade-home .dept-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: var(--border-strong); }.odookade-home .dept-icon { width:52px; height:52px; border-radius:15px; background: var(--accent-soft); color: var(--accent); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:20px; }.odookade-home .dept-card h4 { font-size:1.08rem; margin-bottom:10px; }.odookade-home .dept-card p { color: var(--ink-secondary); font-size:.9rem; line-height:1.85; }/* ---------- Bento (why odookade) - simplified/light ---------- */
.odookade-home .bento-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }.odookade-home .bento-box { background:#fff; border:1px solid var(--border); border-radius:24px; padding:34px; transition: transform .4s, box-shadow .4s, border-color .4s; }.odookade-home .bento-box:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: var(--border-strong); }.odookade-home .bento-large { grid-column:span 2; grid-row:span 2; }.odookade-home .bento-medium { grid-column:span 2; grid-row:span 1; }.odookade-home .bento-small { grid-column:span 1; grid-row:span 1; }.odookade-home .bento-box h3 { font-size:1.4rem; margin-bottom:15px; }.odookade-home .bento-box p { color: var(--ink-secondary); font-size:.95rem; line-height:1.9; }.odookade-home .tech-tags { display:flex; flex-wrap:wrap; gap:10px; margin-top:15px; }.odookade-home .tech-tags span { padding:8px 16px; background: var(--surface-alt); border:1px solid var(--border); border-radius:20px; font-size:.82rem; font-family:'Poppins', sans-serif !important; color: var(--ink); }.odookade-home .stat-box { display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; }.odookade-home .stat-number { font-size:3.4rem; font-weight:800; color: var(--accent); line-height:1; }/* ---------- Services ---------- */
.odookade-home .services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:24px; }.odookade-home .service-card { background:#fff; border:1px solid var(--border); border-radius:22px; padding:36px 28px; text-align:right; transition: transform .4s, box-shadow .4s, border-color .4s; }.odookade-home .service-card:hover { transform: translateY(-8px); box-shadow: var(--shadow); border-color: var(--border-strong); }.odookade-home .service-icon { width:58px; height:58px; border-radius:16px; background: var(--accent-soft); color: var(--accent); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:22px; }.odookade-home .service-card h3 { font-size:1.22rem; margin-bottom:13px; }.odookade-home .service-card p { color: var(--ink-secondary); font-size:.92rem; line-height:1.85; }/* ---------- Download banner (replaces the terminal) ---------- */
.odookade-home .download-banner {
    background: linear-gradient(135deg, #1B1424, #2B1E3F 55%, #141018);
    border-radius:32px; padding:64px 56px; position:relative; overflow:hidden;
    display:flex; align-items:center; justify-content:space-between; gap:40px; box-shadow: var(--shadow);
}.odookade-home .download-banner::before {
    content:''; position:absolute; inset:0;
    background: radial-gradient(circle at 85% 20%, rgba(169,130,47,.22), transparent 55%),
                radial-gradient(circle at 10% 90%, rgba(124,58,237,.28), transparent 55%);
    pointer-events:none;
}.odookade-home .banner-text { position:relative; z-index:1; max-width:460px; }.odookade-home .banner-text .badge { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:#D9C68F; }.odookade-home .banner-text h2 { color:#fff; font-size:2rem; font-weight:800; margin:18px 0 14px; line-height:1.4; }.odookade-home .banner-text p { color:#C3BBD4; font-size:.98rem; line-height:1.9; margin-bottom:26px; }.odookade-home .banner-cube { position:relative; z-index:1; width:200px; height:200px; perspective:1000px; flex-shrink:0; }.odookade-home .banner-cube-inner { width:100%; height:100%; position:relative; transform-style:preserve-3d; animation: odk-banner-cube-spin 16s linear infinite; transition: transform .15s ease-out; }.odookade-home .banner-cube .bface { position:absolute; inset:0; border-radius:26px; }.odookade-home .banner-cube .bf-front { transform: translateZ(100px); background: linear-gradient(135deg,#8B5CF6,#5B21B6); }.odookade-home .banner-cube .bf-back { transform: translateZ(-100px) rotateY(180deg); background:#2E1A57; }.odookade-home .banner-cube .bf-right { transform: rotateY(90deg) translateZ(100px); background: linear-gradient(135deg,#D4AF6A,#A9822F); }.odookade-home .banner-cube .bf-left { transform: rotateY(-90deg) translateZ(100px); background:#6D3FC2; }.odookade-home .banner-cube .bf-top { transform: rotateX(90deg) translateZ(100px); background:#C4B5FD; }.odookade-home .banner-cube .bf-bottom { transform: rotateX(-90deg) translateZ(100px); background:#2E1A57; }
@keyframes odk-banner-cube-spin{ from{ transform: rotateX(-14deg) rotateY(0deg); } to{ transform: rotateX(-14deg) rotateY(360deg); } }

@media (max-width:860px){.odookade-home .download-banner { flex-direction:column; text-align:center; padding:44px 28px; }.odookade-home .banner-text { max-width:100%; }.odookade-home .banner-cube { width:150px; height:150px; }.odookade-home .banner-cube .bface { }
}/* ---------- App-store / course cards (simple, clean) ---------- */
.odookade-home .modules-grid, .odookade-home .courses-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(290px,1fr)); gap:26px; }.odookade-home .module-card, .odookade-home .course-card {
    display:flex; flex-direction:column; background:#fff; border:1px solid var(--border);
    border-radius:22px; padding:28px; position:relative; overflow:hidden;
    transition: transform .4s, border-color .4s, box-shadow .4s;
}.odookade-home .module-card:hover, .odookade-home .course-card:hover { transform: translateY(-6px); border-color: var(--border-strong); box-shadow: var(--shadow); }.odookade-home .module-card-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:18px; }.odookade-home .module-icon, .odookade-home .course-icon {
    width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
    font-size:1.3rem; background: var(--accent-soft); color: var(--accent); flex-shrink:0;
}.odookade-home .tone-warehouse .module-icon { background:#E4F5F4; color:#0D7C78; }.odookade-home .tone-accounting .module-icon { background: var(--gold-soft); color: var(--gold); }.odookade-home .tone-production .module-icon { background:#FBE9E1; color:#B84E2A; }.odookade-home .price-badge { font-family:'Poppins', sans-serif !important; direction:ltr; font-size:.75rem; font-weight:700; padding:5px 12px; border-radius:14px; white-space:nowrap; }.odookade-home .price-badge.free { background: var(--green-soft); color: var(--green); }.odookade-home .price-badge.paid { background: var(--gold-soft); color: var(--gold); }.odookade-home .price-badge.soon { background: var(--accent-soft); color: var(--accent); }.odookade-home .module-card h3, .odookade-home .course-card h3 { font-size:1.16rem; margin-bottom:4px; }.odookade-home .module-name-en, .odookade-home .course-level { font-family:'Poppins', sans-serif !important; direction:ltr; font-size:.74rem; color: var(--ink-secondary); margin-bottom:12px; display:block; }.odookade-home .module-card .tagline, .odookade-home .course-card .tagline { color: var(--ink-secondary); font-size:.9rem; line-height:1.85; margin-bottom:18px; flex-grow:1; }.odookade-home .card-meta-row { display:flex; align-items:center; gap:16px; margin-bottom:16px; font-size:.78rem; color: var(--ink-secondary); }.odookade-home .card-meta-row span { display:flex; align-items:center; gap:5px; }.odookade-home .card-meta-row i { color: var(--gold); font-size:.75rem; }.odookade-home .module-card-footer { display:flex; align-items:center; justify-content:space-between; padding-top:16px; border-top:1px solid var(--border); }.odookade-home .module-category-tag {
    font-size:.76rem; font-weight:600; color: var(--accent); background: var(--accent-soft);
    padding:5px 12px; border-radius:12px; display:flex; align-items:center; gap:6px;
}.odookade-home .view-link { font-size:.83rem; font-weight:700; color: var(--ink); display:flex; align-items:center; gap:6px; transition: gap .25s, color .25s; }.odookade-home .module-card:hover .view-link, .odookade-home .course-card:hover .view-link { gap:10px; color: var(--accent); }.odookade-home .store-more-note { text-align:center; color: var(--ink-secondary); font-size:.9rem; margin-top:32px; }/* ---------- Testimonials (single-slide auto carousel) ---------- */
.odookade-home .testimonials-slider { position:relative; max-width:640px; margin:0 auto; }.odookade-home .testimonials-track { position:relative; min-height:260px; }.odookade-home .testimonial-card {
    background:#fff; border:1px solid var(--border); border-radius:22px; padding:38px; position:absolute; inset:0;
    opacity:0; transform: translateX(24px); pointer-events:none; transition: opacity .55s ease, transform .55s ease;
}.odookade-home .testimonial-card.active { opacity:1; transform: translateX(0); pointer-events:auto; position:relative; }.odookade-home .quote-icon { font-size:2.6rem; color: var(--gold); opacity:.35; position:absolute; top:26px; right:28px; }.odookade-home .testimonial-text { font-size:1.06rem; font-style:italic; color: var(--ink); margin-bottom:26px; position:relative; z-index:1; }.odookade-home .client-info { border-top:1px solid var(--border); padding-top:18px; }.odookade-home .slider-controls { display:flex; justify-content:center; align-items:center; gap:18px; margin-top:24px; }.odookade-home .slider-btn {
    width:40px; height:40px; border-radius:50%; border:1px solid var(--border-strong); background:#fff;
    color: var(--accent); display:flex; align-items:center; justify-content:center; font-size:.9rem; transition: all .25s; flex-shrink:0;
}.odookade-home .slider-btn:hover { background: var(--accent); color:#fff; border-color: var(--accent); }.odookade-home .slider-dots { display:flex; gap:8px; }.odookade-home .slider-dot { width:8px; height:8px; border-radius:50%; background: var(--border-strong); transition: all .3s; cursor:pointer; }.odookade-home .slider-dot.active { background: var(--accent); width:22px; border-radius:5px; }.odookade-home .client-info h4 { font-size:1rem; margin-bottom:3px; }/* ---------- Footer / contact form ---------- */
.odookade-home .modern-footer { background:#141018; color:#EAE5F2; padding-top:110px; padding-bottom:44px; margin-top:0; }.odookade-home .modern-footer .huge-text { color:#fff; }.odookade-home .modern-footer .text-muted { color:#B3A9C4; }.odookade-home .huge-text { font-size:clamp(2.2rem,4.4vw,3.6rem); line-height:1.15; margin-bottom:20px; font-weight:800; }.odookade-home .footer-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; margin-bottom:70px; align-items:start; }.odookade-home .email-link { font-size:1.7rem; font-weight:700; color:#fff; display:inline-block; margin-top:26px; border-bottom:2px solid var(--gold); padding-bottom:4px; }.odookade-home .email-link:hover { color: var(--gold); }.odookade-home .footer-form {
    background: rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:24px;
    padding:38px; box-shadow: 0 30px 70px -24px rgba(0,0,0,.55); backdrop-filter: blur(6px);
}.odookade-home .footer-form .input-container input, .odookade-home .footer-form .input-container textarea { color:#fff; border-bottom-color: rgba(255,255,255,.2); }.odookade-home .footer-form .input-container label { color:#A79DBE; }.odookade-home .footer-form .input-container input:focus, .odookade-home .footer-form .input-container textarea:focus { border-bottom-color: var(--gold); }.odookade-home .footer-form .input-container input:focus ~ label, .odookade-home .footer-form .input-container input:not(:placeholder-shown) ~ label, .odookade-home .footer-form .input-container textarea:focus ~ label, .odookade-home .footer-form .input-container textarea:not(:placeholder-shown) ~ label { color: var(--gold); }.odookade-home .footer-form .btn-glow { background:transparent; color:#fff; border-color: rgba(255,255,255,.35); }.odookade-home .footer-form .btn-glow:hover { background: rgba(255,255,255,.1); }.odookade-home .input-container { position:relative; margin-bottom:28px; }.odookade-home .input-container input, .odookade-home .input-container textarea { width:100%; background:transparent; border:none; border-bottom:1px solid var(--border-strong); padding:14px 0; color: var(--ink); font-size:1rem; outline:none; transition: border-color .3s; }.odookade-home .input-container label { position:absolute; right:0; top:14px; color: var(--ink-secondary); pointer-events:none; transition:all .3s; }.odookade-home .input-container input:focus, .odookade-home .input-container textarea:focus { border-bottom-color: var(--accent); }.odookade-home .input-container input:focus ~ label, .odookade-home .input-container input:not(:placeholder-shown) ~ label, .odookade-home .input-container textarea:focus ~ label, .odookade-home .input-container textarea:not(:placeholder-shown) ~ label { top:-10px; font-size:.78rem; color: var(--accent); }.odookade-home .footer-bottom { display:flex; justify-content:space-between; align-items:center; border-top:1px solid rgba(255,255,255,.1); padding-top:28px; color:#9990AC; flex-wrap:wrap; gap:16px; }.odookade-home .social-hero { display:flex; gap:12px; }.odookade-home .social-icon { width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:50%; border:1px solid rgba(255,255,255,.14); font-size:1.05rem; color:#EAE5F2; transition:all .3s; }.odookade-home .social-icon:hover { background: var(--gold); color:#141018; border-color: var(--gold); transform:translateY(-3px); }/* ---------- Reveal ---------- */
.odookade-home .reveal { opacity:0; transform: translateY(40px); transition: all .8s cubic-bezier(.5,0,0,1); }.odookade-home .reveal.active { opacity:1; transform: translateY(0); }.odookade-home .reveal-delay-1 { transition-delay:.15s; }.odookade-home .reveal-delay-2 { transition-delay:.3s; }

/* ---------- Responsive ---------- */
@media (max-width:1200px){.odookade-home .bento-grid { grid-template-columns:repeat(3,1fr); }.odookade-home .bento-large, .odookade-home .bento-medium { grid-column:span 2; }.odookade-home .bento-small { grid-column:span 1; }.odookade-home .why-erp-grid { grid-template-columns:repeat(2,1fr); }.odookade-home .dept-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:992px){.odookade-home .section { padding:90px 0; }.odookade-home .header { width:calc(100% - 30px); }.odookade-home .nav-links, .odookade-home .hidden-mobile { display:none; }.odookade-home .mobile-menu-btn { display:block; }.odookade-home .explainer-grid { grid-template-columns:1fr; gap:40px; }.odookade-home .explainer-text h2 { text-align:center; }.odookade-home .explainer-text { text-align:center; }.odookade-home .explainer-text ul li { text-align:right; }
}
@media (max-width:768px){.odookade-home .bento-grid, .odookade-home .services-grid, .odookade-home .testimonials-grid, .odookade-home .modules-grid, .odookade-home .courses-grid, .odookade-home .why-erp-grid, .odookade-home .dept-grid { grid-template-columns:1fr; }.odookade-home .bento-large, .odookade-home .bento-medium, .odookade-home .bento-small { grid-column:span 1; }.odookade-home .footer-grid { grid-template-columns:1fr; gap:36px; }.odookade-home .footer-bottom { flex-direction:column; text-align:center; }.odookade-home .erp-showcase { height:auto; }
}
@media (max-width:480px){.odookade-home .hero-buttons { flex-direction:column; width:100%; }.odookade-home .btn-large { width:100%; }.odookade-home .footer-form { padding:26px; }.odookade-home .huge-text { font-size:2rem; }
}/* =========================================================
   App Store listing + single module page
   ========================================================= */
.odookade-home .page-hero { padding:150px 0 50px; position:relative; }.odookade-home .page-hero .eyebrow {
    display:inline-flex; align-items:center; gap:8px; font-family:'Poppins', sans-serif !important;
    direction:ltr; font-size:.78rem; letter-spacing:.08em; color: var(--accent); background: var(--accent-soft);
    padding:6px 16px; border-radius:20px; margin-bottom:20px;
}.odookade-home .page-hero h1 { font-size:clamp(2rem,4vw,2.9rem); font-weight:800; margin-bottom:16px; line-height:1.3; max-width:16ch; }.odookade-home .page-hero p.lead { font-size:1.05rem; color: var(--ink-secondary); max-width:640px; line-height:1.95; }.odookade-home .page-stats-row { display:flex; gap:36px; margin-top:34px; flex-wrap:wrap; }.odookade-home .page-stats-row .stat { display:flex; flex-direction:column; }.odookade-home .page-stats-row .stat b { font-size:1.7rem; font-weight:800; color: var(--accent); font-family:'Poppins', sans-serif !important; }.odookade-home .page-stats-row .stat span { color: var(--ink-secondary); font-size:.82rem; }/* ---------- Filter bar ---------- */
.odookade-home .filter-bar {
    display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:14px 18px;
    background:#fff; border:1px solid var(--border); border-radius:22px; margin-bottom:40px; box-shadow: var(--shadow-sm);
}.odookade-home .filter-bar .filter-label { font-size:.82rem; color: var(--ink-secondary); white-space:nowrap; padding-left:4px; }.odookade-home .filter-pill {
    display:inline-flex; align-items:center; gap:7px; padding:9px 16px; border-radius:18px;
    background: var(--surface-alt); border:1px solid var(--border); color: var(--ink-secondary);
    font-size:.85rem; font-weight:600; cursor:pointer; transition: all .25s; white-space:nowrap;
}.odookade-home .filter-pill i { font-size:.8rem; }.odookade-home .filter-pill:hover { color: var(--ink); border-color: var(--border-strong); }.odookade-home .filter-pill.active { background: var(--gradient-brand); color:#fff; border-color:transparent; box-shadow: var(--shadow-sm); }.odookade-home .filter-pill .count { font-family:'Poppins', sans-serif !important; font-size:.72rem; opacity:.8; }.odookade-home .filter-search {
    margin-inline-start:auto; display:flex; align-items:center; gap:9px; background: var(--surface-alt);
    border:1px solid var(--border); border-radius:18px; padding:8px 16px; min-width:220px;
}.odookade-home .filter-search i { color: var(--ink-secondary); font-size:.82rem; }.odookade-home .filter-search input { background:none; border:none; outline:none; color: var(--ink); font-size:.86rem; width:100%; }.odookade-home .filter-search input::placeholder { color: var(--ink-secondary); }.odookade-home .modules-empty { grid-column:1/-1; text-align:center; padding:70px 20px; color: var(--ink-secondary); }.odookade-home .modules-empty i { font-size:2.3rem; margin-bottom:18px; opacity:.4; display:block; }/* ---------- Single module page ---------- */
.odookade-home .module-breadcrumb {
    padding-top:140px; display:flex; align-items:center; gap:9px; font-size:.86rem;
    color: var(--ink-secondary); margin-bottom:36px;
}.odookade-home .module-breadcrumb a { color: var(--ink-secondary); transition: color .25s; }.odookade-home .module-breadcrumb a:hover { color: var(--accent); }.odookade-home .module-breadcrumb .current { color: var(--ink); font-weight:600; }.odookade-home .module-detail-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,380px); gap:40px; margin-bottom:70px; align-items:start; }.odookade-home .module-detail-main .module-icon { width:68px; height:68px; font-size:1.8rem; border-radius:18px; margin-bottom:22px; }.odookade-home .module-detail-main h1 { font-size:2.3rem; margin-bottom:8px; }.odookade-home .module-detail-main .module-name-en { font-size:.92rem; margin-bottom:18px; }.odookade-home .badges-row { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:26px; }.odookade-home .spec-pill {
    font-size:.8rem; padding:6px 14px; border-radius:14px; background: var(--surface-alt);
    border:1px solid var(--border); color: var(--ink-secondary); display:inline-flex; align-items:center; gap:6px;
}.odookade-home .description-block { color: var(--ink-secondary); font-size:1.03rem; line-height:2; }.odookade-home .module-cta-card { background:#fff; border:1px solid var(--border); border-radius:24px; padding:32px; position:sticky; top:110px; box-shadow: var(--shadow-sm); }.odookade-home .version-select { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:22px; padding-bottom:22px; border-bottom:1px solid var(--border); }.odookade-home .version-select-label { font-size:.82rem; color: var(--ink-secondary); white-space:nowrap; }.odookade-home .version-pills { display:flex; gap:8px; flex-wrap:wrap; }.odookade-home .version-pill {
    font-family:'Poppins', sans-serif !important; direction:ltr; font-size:.8rem; font-weight:600;
    padding:5px 14px; border-radius:12px; background: var(--surface-alt); border:1px solid var(--border);
    color: var(--ink-secondary); cursor:pointer; transition: all .25s;
}.odookade-home .version-pill:hover { color: var(--ink); border-color: var(--border-strong); }.odookade-home .version-pill.active { background: var(--gradient-brand); color:#fff; border-color:transparent; }.odookade-home .module-cta-card .price-line { display:flex; align-items:baseline; gap:8px; margin-bottom:6px; }.odookade-home .module-cta-card .price-value { font-size:1.9rem; font-weight:800; font-family:'Poppins', sans-serif !important; direction:ltr; }.odookade-home .module-cta-card .price-value.free-color { color: var(--green); }.odookade-home .module-cta-card .price-unit { color: var(--ink-secondary); font-size:.9rem; }.odookade-home .module-cta-card .price-note { color: var(--ink-secondary); font-size:.85rem; margin-bottom:22px; }.odookade-home .module-cta-card .btn { width:100%; margin-bottom:12px; }.odookade-home .cta-meta { margin-top:22px; padding-top:20px; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:11px; font-size:.84rem; color: var(--ink-secondary); }.odookade-home .cta-meta li { display:flex; align-items:center; gap:9px; }.odookade-home .cta-meta i { color: var(--accent); width:16px; }.odookade-home .install-snippet {
    margin-top:22px; background:#141018; border-radius:14px; padding:15px 18px;
    font-family:'Courier New', Courier, monospace !important; direction:ltr; text-align:left;
    font-size:.78rem; color:#D9D5E3; overflow-x:auto; white-space:nowrap;
}.odookade-home .install-snippet .prompt { color: var(--green); }.odookade-home .install-snippet .flag { color: var(--accent-2); }.odookade-home .module-section-title { font-size:1.55rem; margin-bottom:26px; }.odookade-home .feature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; margin-bottom:64px; }.odookade-home .feature-card { background:#fff; border:1px solid var(--border); border-radius:18px; padding:26px; }.odookade-home .feature-card .f-icon {
    width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    background: var(--accent-soft); color: var(--accent); margin-bottom:14px; font-size:1.1rem;
}.odookade-home .feature-card h4 { font-size:1rem; margin-bottom:8px; }.odookade-home .feature-card p { color: var(--ink-secondary); font-size:.88rem; line-height:1.8; }.odookade-home .related-modules { margin-bottom:40px; }.odookade-home .related-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px; }.odookade-home .module-not-found { padding:160px 0 120px; text-align:center; }.odookade-home .module-not-found i { font-size:2.8rem; color: var(--accent-2); opacity:.6; margin-bottom:22px; display:block; }.odookade-home .module-not-found h2 { font-size:1.8rem; margin-bottom:12px; }.odookade-home .module-not-found p { color: var(--ink-secondary); margin-bottom:28px; }.odookade-home .toast-notice {
    position:fixed; bottom:30px; left:50%; transform:translateX(-50%) translateY(20px);
    background:#141018; border:1px solid rgba(255,255,255,.1); color:#fff; padding:14px 24px;
    border-radius:16px; box-shadow: var(--shadow); font-size:.88rem; display:flex; align-items:center;
    gap:9px; z-index:10002; opacity:0; pointer-events:none; transition: all .4s cubic-bezier(.5,0,0,1);
}.odookade-home .toast-notice.show { opacity:1; transform:translateX(-50%) translateY(0); }.odookade-home .toast-notice i { color: var(--gold); }

@media (max-width:992px){.odookade-home .module-detail-hero { grid-template-columns:1fr; }.odookade-home .module-cta-card { position:static; }.odookade-home .page-hero { padding-top:120px; }
}
@media (max-width:768px){.odookade-home .filter-search { width:100%; margin-inline-start:0; }.odookade-home .module-breadcrumb { padding-top:110px; }.odookade-home .module-detail-main h1 { font-size:1.8rem; }
}
@media (max-width:480px){.odookade-home .version-select { flex-direction:column; align-items:flex-start; gap:10px; }.odookade-home .install-snippet { white-space:normal; word-break:break-all; font-size:.72rem; }.odookade-home .module-cta-card { padding:24px; }
}