/* =====================================================================
   MaquishTech Venture® - global styles
   Bootstrap 5 base + premium interactions (no React)
   ===================================================================== */

:root{
  --mt-orange:#F26522;
  --mt-orange-dark:#e05a1a;
  --mt-ink:#111827;
  --mt-gray:#EFEFEF;
  --mt-gray-2:#F5F5F5;
  --mt-ease:cubic-bezier(0.25,0.1,0.25,1);
}

*{ -webkit-font-smoothing:antialiased; }
body{ font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; color:#111827; }

/* ---------- Brand button ---------- */
.btn-mt-orange{ background:var(--mt-orange); color:#fff; border:none; transition:background .3s var(--mt-ease); }
.btn-mt-orange:hover{ background:var(--mt-orange-dark); color:#fff; }

/* Navbar button alignment */
#mainNav .navbar-nav .nav-link{ padding-left:10px; padding-right:10px; }
#mainNav .btn{ white-space:nowrap; }
@media(max-width:991px){
  #mainNav .navbar-collapse{ padding-top:12px; }
  #mainNav .navbar-nav{ margin-bottom:12px; }
  #mainNav .d-flex{ flex-direction:column; gap:8px; align-items:stretch !important; }
  #mainNav .btn{ width:100%; text-align:center; }
}

/* ---------- Pill nav links ---------- */
.navpill-link{ transition:color .3s var(--mt-ease); }
.navpill-link:hover{ color:#6b7280 !important; }

/* ---------- Text-roll hover animation ---------- */
.roll-text{ display:block; line-height:20px; height:20px; }
.group{ transition:all .3s var(--mt-ease); }
.group:hover .roll-text{ transform:translateY(-50%); transition:transform .5s var(--mt-ease); }
.group-hover-rotate{ transition:transform .5s var(--mt-ease); transform:rotate(-45deg); }
.group:hover .group-hover-rotate{ transform:rotate(0deg); }

/* ---------- Hero ---------- */
.hero-shell{ position:relative; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; background:#EFEFEF; overflow:hidden; }
#heroShader{ position:absolute; inset:0; z-index:1; pointer-events:none; width:100%; height:100%; display:block; }
.hero-content{ position:relative; z-index:2; width:100%; }
.hero-h1{ font-weight:500; line-height:1.08; letter-spacing:-0.03em; color:#111827;
  font-size:clamp(1.75rem,6vw,3.5rem); margin:0; }
@media(min-width:640px){ .hero-h1{ font-size:clamp(2.25rem,4.5vw,4.2rem); } }
@media(max-width:639px){ .hero-h1{ font-size:clamp(1.6rem,8vw,2.2rem); line-height:1.12; } }
.hero-sub{ color:#4b5563; max-width:680px; font-size:clamp(14px,1.6vw,18px); line-height:1.6; margin-top:1rem; }
@media(max-width:639px){ .hero-sub{ font-size:15px; } }
.hero-cta-row{ display:flex; flex-direction:column; gap:16px; margin-top:1.5rem; }
@media(min-width:576px){ .hero-cta-row{ flex-direction:row; align-items:center; gap:16px; } }
.hero-consult-card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:20px 24px; margin-top:2rem; max-width:680px; }
.hero-consult-card p{ margin:0; font-size:15px; color:#374151; line-height:1.5; }
.hero-consult-card strong{ color:#111827; }
.hero-tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:2rem; font-size:13px; color:#6b7280; }
.hero-tags span.sep{ color:#d1d5db; }

/* hero trust pills + scroll cue (full-height hero) */
.hero-top-bar{ position:relative; z-index:2; }
.hero-pill{ display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.7);
  border:1px solid #e5e7eb; border-radius:9999px; padding:5px 12px; font-size:12px; color:#374151;
  backdrop-filter:blur(4px); }
.hero-pill i{ font-size:13px; color:var(--mt-orange); }
@media(max-width:639px){ .hero-pill{ font-size:11px; padding:4px 10px; } }
.hero-scroll-cue{ position:relative; z-index:2; }
.hero-scroll-link{ transition:color .3s var(--mt-ease); }
.hero-scroll-link i{ animation:heroScrollBounce 1.6s var(--mt-ease) infinite; }
.hero-scroll-link:hover{ color:#111827 !important; }
@keyframes heroScrollBounce{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(4px); }
}

/* hero secondary CTA — match primary height */
.hero-cta-secondary{ line-height:20px; }

/* hero visual panel (right column) */
.hero-visual{ position:relative; padding:20px 0; }
.hero-vcard{ background:rgba(255,255,255,.85); backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.6); border-radius:20px; padding:24px;
  box-shadow:0 20px 60px rgba(0,0,0,.08); position:relative; z-index:2; }
.hero-vdot{ width:10px; height:10px; border-radius:50%; background:#ef4444; display:inline-block; }
.hero-vscreen{ background:#f9fafb; border-radius:12px; padding:16px; margin-top:12px; border:1px solid #f3f4f6; }
.hero-vscreen-bar{ display:flex; align-items:center; gap:4px; flex-wrap:wrap;
  font-size:11px; color:#9ca3af; padding-bottom:12px; border-bottom:1px solid #f3f4f6; margin-bottom:12px; }
.hero-vscreen-arrow{ color:#d1d5db; }
.hero-vscreen-active{ color:var(--mt-orange); font-weight:600; }
.hero-vscreen-body{ padding:4px 0; }
.hero-vline{ height:8px; border-radius:4px; background:#e5e7eb; margin-bottom:8px; }
.hero-vchip{ font-size:11px; padding:4px 10px; border-radius:9999px; background:#fef3c7; color:#b45309; font-weight:500; }
.hero-vprogress{ width:80px; height:6px; border-radius:3px; background:#e5e7eb; overflow:hidden; }
.hero-vprogress-fill{ width:72%; height:100%; background:linear-gradient(90deg,#F26522,#ff8a4a); border-radius:3px; }
.hero-vavatar{ width:28px; height:28px; border-radius:50%; background:var(--mt-orange); border:2px solid #fff; }
.hero-vlive{ font-size:11px; color:#16a34a; display:inline-flex; align-items:center; gap:5px; font-weight:500; }
.hero-vlive-dot{ width:7px; height:7px; border-radius:50%; background:#16a34a; animation:heroPulse 1.5s ease infinite; }
@keyframes heroPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
.hero-vbadge{ position:absolute; width:48px; height:48px; border-radius:14px; background:#fff;
  border:1px solid #e5e7eb; box-shadow:0 8px 24px rgba(0,0,0,.08); display:flex;
  align-items:center; justify-content:center; z-index:3; }
.hero-vbadge i{ font-size:22px; color:var(--mt-orange); }
.hero-vbadge-1{ top:0; right:8%; animation:heroFloat 4s ease infinite; }
.hero-vbadge-2{ top:30%; right:-12px; animation:heroFloat 4s ease infinite .8s; }
.hero-vbadge-3{ bottom:10%; left:-12px; animation:heroFloat 4s ease infinite 1.4s; }
.hero-vbadge-4{ bottom:0; right:20%; animation:heroFloat 4s ease infinite 2s; }
@keyframes heroFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}

/* partner badge */
.partner-badge{ display:inline-flex; align-items:center; gap:10px; background:#fff; border-radius:4px;
  padding:8px 12px; box-shadow:0 2px 8px rgba(0,0,0,.08); transition:box-shadow .3s var(--mt-ease); }
.partner-badge:hover{ box-shadow:0 4px 16px rgba(0,0,0,.12); }

/* ---------- Section heading ---------- */
.section-h2{ font-weight:500; line-height:1.12; letter-spacing:-0.02em; color:#111827;
  font-size:clamp(1.5rem,4vw,3.2rem); }
.section-num{ width:26px; height:26px; border-radius:50%; background:#111827; color:#fff;
  font-size:11px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; }
@media(min-width:640px){ .section-num{ width:28px; height:28px; font-size:12px; } }

/* ---------- Case study cards ---------- */
.cs-card{ cursor:pointer; }
.cs-media{ position:relative; border-radius:16px; overflow:hidden; }
.cs-btn{ position:absolute; bottom:16px; left:16px; height:36px; width:36px; border-radius:9999px;
  display:flex; align-items:center; justify-content:center; transition:all .3s ease-in-out; }
.cs-btn .cs-btn-label{ opacity:0; width:0; overflow:hidden; white-space:nowrap; transition:opacity .2s ease-in-out .1s; font-size:13px; font-weight:500; }
.cs-card:hover .cs-btn{ width:148px; padding:0 14px; justify-content:space-between; }
.cs-card:hover .cs-btn .cs-btn-label{ opacity:1; }
.cs-btn-dark{ background:#111827; color:#fff; }
.cs-card:hover .cs-btn-dark{ width:168px; }
.cs-btn-icon{ transition:transform .3s ease-in-out; transform:rotate(-45deg); }
.cs-card:hover .cs-btn-icon{ transform:rotate(0deg); }

/* ---------- General utility ---------- */
.container-1440{ max-width:1440px; margin-left:auto; margin-right:auto; }
.text-orange{ color:var(--mt-orange) !important; }
.bg-ink{ background:var(--mt-ink) !important; }
.grad-orange{ background:linear-gradient(135deg,#F26522,#ff8a4a); }
.card-hover{ transition:transform .3s var(--mt-ease), box-shadow .3s var(--mt-ease); }
.card-hover:hover{ transform:translateY(-4px); box-shadow:0 12px 32px rgba(0,0,0,.08); }

/* numbered solution cards */
.sol-card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:28px; height:100%;
  transition:all .3s var(--mt-ease); }
.sol-card:hover{ border-color:var(--mt-orange); transform:translateY(-4px); box-shadow:0 12px 28px rgba(242,101,34,.12); }
.sol-card.border-orange{ border-color:var(--mt-orange); border-width:2px; }
.sol-num{ font-size:13px; font-weight:600; color:var(--mt-orange); letter-spacing:.05em; }

/* pipeline chips */
.pipe-chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:9999px; font-size:13px; font-weight:500; }
.score-hot{ background:#fee2e2; color:#b91c1c; }
.score-warm{ background:#fef3c7; color:#b45309; }
.score-nurture{ background:#dbeafe; color:#1d4ed8; }

/* admin sidebar */
.admin-side{ position:sticky; top:0; height:100vh; overflow-y:auto; overflow-x:hidden; }
.admin-side::-webkit-scrollbar{ width:5px; }
.admin-side::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.15); border-radius:3px; }
.admin-side .nav-link{ color:#cbd5e1; border-radius:8px; padding:8px 12px; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.admin-side .nav-link:hover{ background:rgba(255,255,255,.06); color:#fff; }
.admin-side .nav-link.active{ background:var(--mt-orange); color:#fff; }
.admin-side .nav-link i{ font-size:15px; }

/* admin settings tabs */
.admin-tabs .nav-link{ color:#6b7280; border:1px solid #e5e7eb; border-radius:9999px; padding:7px 18px; font-size:13px; font-weight:500; background:#fff; }
.admin-tabs .nav-link:hover{ color:#111827; border-color:#d1d5db; }
.admin-tabs .nav-link.active{ background:var(--mt-orange); color:#fff; border-color:var(--mt-orange); }

/* admin table action buttons consistent */
.admin-action-btn{ width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; padding:0; }

/* ============ Dashboard ============ */
.dash-welcome{ background:linear-gradient(135deg,#fff,#f8fafc); border:1px solid #e5e7eb; border-radius:16px; padding:24px 28px; }
.dash-welcome h2{ font-size:22px; font-weight:600; color:#111827; margin:0; }
.dash-clock{ font-size:24px; font-weight:700; color:var(--mt-orange); font-variant-numeric:tabular-nums; letter-spacing:.02em; }

/* KPI cards */
.dash-kpi-card{ background:#fff; border:1px solid #e5e7eb; border-radius:14px; padding:20px; transition:all .3s var(--mt-ease); position:relative; overflow:hidden; }
.dash-kpi-card::before{ content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--kpi-color); border-radius:14px 14px 0 0; }
.dash-kpi-card:hover{ transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,.08); border-color:var(--kpi-color); }
.dash-kpi-icon{ width:40px; height:40px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb, var(--kpi-color) 12%, #fff); margin-bottom:12px; }
.dash-kpi-icon i{ font-size:20px; color:var(--kpi-color); }
.dash-kpi-value{ font-size:24px; font-weight:700; color:#111827; line-height:1; }
.dash-kpi-label{ font-size:12px; color:#6b7280; margin-top:4px; }

/* Stage cards */
.dash-stage-card{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:16px; transition:all .3s var(--mt-ease); }
.dash-stage-card:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.06); }
.dash-stage-num{ font-size:22px; font-weight:700; color:#111827; }
.dash-stage-label{ font-size:12px; color:#6b7280; margin-bottom:8px; }
.dash-stage-bar{ height:4px; background:#f3f4f6; border-radius:2px; overflow:hidden; }
.dash-stage-bar-fill{ height:100%; background:var(--stage-color); border-radius:2px; transition:width .6s var(--mt-ease); }

/* Donut chart */
.dash-donut{ display:flex; justify-content:center; }
.dash-donut-svg{ width:140px; height:140px; }
.dash-donut-seg{ transition:stroke-dasharray .8s var(--mt-ease); }
.dash-legend{ display:flex; flex-direction:column; gap:6px; }
.dash-legend-item{ display:flex; align-items:center; gap:6px; font-size:12px; color:#6b7280; }
.dash-legend-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }

/* Bar chart */
.dash-bars{ display:flex; align-items:flex-end; gap:6px; height:140px; padding-top:20px; }
.dash-bar-col{ flex:1; display:flex; flex-direction:column; align-items:center; height:100%; justify-content:flex-end; }
.dash-bar{ width:100%; max-width:28px; background:linear-gradient(180deg,#F26522,#ff8a4a); border-radius:6px 6px 0 0; position:relative; transition:height .6s var(--mt-ease); min-height:4px; }
.dash-bar-val{ position:absolute; top:-18px; left:50%; transform:translateX(-50%); font-size:10px; font-weight:600; color:#6b7280; }
.dash-bar-label{ font-size:10px; color:#9ca3af; margin-top:6px; }

/* Funnel */
.dash-funnel-row{ display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.dash-funnel-label{ font-size:12px; color:#6b7280; width:70px; flex-shrink:0; }
.dash-funnel-track{ flex:1; height:24px; background:#f9fafb; border-radius:6px; overflow:hidden; }
.dash-funnel-fill{ height:100%; border-radius:6px; display:flex; align-items:center; justify-content:flex-end; padding-right:8px; color:#fff; font-size:11px; font-weight:600; transition:width .6s var(--mt-ease); min-width:24px; }

/* Revenue summary */
.dash-rev-row{ display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid #f3f4f6; }
.dash-rev-bar{ height:6px; background:#f3f4f6; border-radius:3px; overflow:hidden; }
.dash-rev-bar-paid{ height:100%; background:#16a34a; border-radius:3px; transition:width .6s var(--mt-ease); }

/* Quick stats grid */
.dash-quick-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.dash-quick-item{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:14px 8px; background:#f9fafb; border-radius:10px; text-decoration:none; transition:all .3s var(--mt-ease); }
.dash-quick-item:hover{ background:#fef3f4; transform:translateY(-2px); }
.dash-quick-item i{ font-size:20px; color:var(--mt-orange); }
.dash-quick-item span{ font-size:20px; font-weight:700; color:#111827; }
.dash-quick-item small{ font-size:11px; color:#6b7280; }

/* ============ Page Hero (2-col with visual panel) ============ */
.page-hero{ background:#EFEFEF; position:relative; overflow:hidden; }
.page-hero::before{ content:''; position:absolute; inset:0; background:
  radial-gradient(circle at 80% 20%, rgba(242,101,34,.06) 0%, transparent 50%),
  radial-gradient(circle at 20% 80%, rgba(59,130,246,.04) 0%, transparent 50%); pointer-events:none; }
.page-hero-inner{ position:relative; z-index:1; }
.page-hero-badge{ font-size:13px; font-weight:500; border:1px solid #e5e7eb; border-radius:9999px; padding:4px 16px; display:inline-block; background:#fff; }
.page-hero-h1{ font-weight:500; letter-spacing:-0.02em; font-size:clamp(2rem,5vw,3.5rem); line-height:1.1; color:#111827; margin-top:16px; }
.page-hero-sub{ color:#4b5563; max-width:560px; font-size:clamp(15px,1.6vw,18px); line-height:1.6; margin-top:12px; }

/* Visual panel (right side) */
.page-hero-visual{ position:relative; padding:20px 0; }
.ph-card{ background:rgba(255,255,255,.85); backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.6); border-radius:20px; padding:24px;
  box-shadow:0 20px 60px rgba(0,0,0,.08); position:relative; z-index:2; }
.ph-card-title{ font-size:13px; font-weight:600; color:#111827; margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.ph-card-title i{ color:var(--mt-orange); }
.ph-dot{ width:10px; height:10px; border-radius:50%; display:inline-block; }
.ph-screen{ background:#f9fafb; border-radius:12px; padding:16px; border:1px solid #f3f4f6; }
.ph-line{ height:8px; border-radius:4px; background:#e5e7eb; margin-bottom:8px; }
.ph-chip{ font-size:11px; padding:4px 10px; border-radius:9999px; font-weight:500; display:inline-block; }
.ph-badge{ position:absolute; width:48px; height:48px; border-radius:14px; background:#fff;
  border:1px solid #e5e7eb; box-shadow:0 8px 24px rgba(0,0,0,.08); display:flex;
  align-items:center; justify-content:center; z-index:3; }
.ph-badge i{ font-size:22px; }
.ph-badge-1{ top:0; right:8%; animation:phFloat 4s ease infinite; }
.ph-badge-2{ top:30%; right:-12px; animation:phFloat 4s ease infinite .8s; }
.ph-badge-3{ bottom:10%; left:-12px; animation:phFloat 4s ease infinite 1.4s; }
.ph-badge-4{ bottom:0; right:20%; animation:phFloat 4s ease infinite 2s; }
@keyframes phFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }
.ph-stat{ text-align:center; padding:16px 8px; background:#f9fafb; border-radius:12px; }
.ph-stat-num{ font-size:28px; font-weight:700; color:var(--mt-orange); }
.ph-stat-label{ font-size:12px; color:#6b7280; margin-top:2px; }
.ph-icon-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ph-icon-item{ display:flex; flex-direction:column; align-items:center; gap:6px; padding:14px 8px; background:#f9fafb; border-radius:12px; transition:all .3s var(--mt-ease); }
.ph-icon-item:hover{ background:#fff; transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.06); }
.ph-icon-item i{ font-size:22px; color:var(--mt-orange); }
.ph-icon-item span{ font-size:11px; color:#6b7280; text-align:center; }
.ph-flow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ph-flow-step{ font-size:11px; padding:6px 12px; border-radius:8px; background:#f3f4f6; color:#6b7280; font-weight:500; }
.ph-flow-step.active{ background:var(--mt-orange); color:#fff; }
.ph-flow-arrow{ color:#d1d5db; font-size:12px; }
@media(max-width:991px){ .page-hero-visual{ display:none; } }

/* mobile bottom nav */
.bottom-nav{ position:fixed; bottom:0; left:0; right:0; z-index:30; background:#fff; border-top:1px solid #e5e7eb;
  display:flex; justify-content:space-around; padding:8px 0; }
.bottom-nav a{ font-size:11px; color:#6b7280; text-decoration:none; text-align:center; }
.bottom-nav a.active{ color:var(--mt-orange); font-weight:600; }
@media(min-width:768px){ .bottom-nav{ display:none; } }

/* form steps */
.step-dot{ width:32px; height:32px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:600; background:#e5e7eb; color:#6b7280; }
.step-dot.active{ background:var(--mt-orange); color:#fff; }
.step-dot.done{ background:#16a34a; color:#fff; }

/* liquid-glass utilities (defined per spec, not actively used) */
.liquid-glass{ background:rgba(255,255,255,.01); backdrop-filter:blur(4px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.liquid-glass-strong{ background:rgba(255,255,255,.01); backdrop-filter:blur(50px); }

/* legal pages */
.legal-content h2{ font-size:clamp(1.1rem,2.5vw,1.5rem); font-weight:600; margin-top:2rem; margin-bottom:.75rem; color:#111827; }
.legal-content p{ font-size:15px; line-height:1.7; color:#374151; margin-bottom:1rem; }
.legal-content ul{ font-size:15px; line-height:1.8; color:#374151; padding-left:1.25rem; margin-bottom:1rem; }
.legal-content ul li{ margin-bottom:.4rem; }
.legal-content a{ color:var(--mt-orange); text-decoration:none; }
.legal-content a:hover{ text-decoration:underline; }
.legal-content table{ font-size:14px; }
.legal-content table th{ background:#f9fafb; }
