/* ==========================================================================
   Auto3D marketing landing (/auto3d). Light theme, matches site (#2563eb).
   ========================================================================== */
body.auto3d-home-page,
body:has(.a3h) {
    --a3h-font-ui:'Helvetica Neue',Helvetica,'PingFang SC',Tahoma,Arial,sans-serif;
    font-family:var(--a3h-font-ui);
}
body.auto3d-home-page .header,
body.auto3d-home-page .mobile-nav-panel,
body:has(.a3h) .header,
body:has(.a3h) .mobile-nav-panel {
    font-family:var(--a3h-font-ui);
}
body.auto3d-home-page .header *,
body.auto3d-home-page .mobile-nav-panel *,
body:has(.a3h) .header *,
body:has(.a3h) .mobile-nav-panel * {
    font-family:var(--a3h-font-ui);
}
.a3h { --p:#2563eb; --p-dark:#1d4ed8; --ink:#111827; --muted:#6b7280; --line:#e5e7eb;
       --soft:#fafafa; --soft2:#f3f4f6;
       --font-ui:var(--a3h-font-ui,'Helvetica Neue',Helvetica,'PingFang SC',Tahoma,Arial,sans-serif);
       --weight-title:500; --weight-accent:600;
       color:var(--ink); font-family:var(--font-ui);
       -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.a3h *, .a3h *::before, .a3h *::after { box-sizing:border-box; font-family:var(--font-ui); }
.a3h strong { font-weight:var(--weight-accent); }
.a3h em { font-style:normal; }
.a3h-wrap { width: 92%; max-width: 1200px; margin: 0 auto; }
.a3h a { text-decoration: none; }
.a3h section { position: relative; }

/* ---- buttons ---- */
.a3h-btn { display:inline-flex; align-items:center; gap:.5em; justify-content:center;
    background:#2563eb; color:#fff; font-weight:var(--weight-accent);
    font-size:1rem; padding:.85rem 1.7rem; border-radius:12px; border:none; cursor:pointer;
    box-shadow:0 4px 15px rgba(37,99,235,.3); transition:transform .12s, box-shadow .12s, background .12s; }
.a3h-btn:hover { transform:translateY(-2px); background:#1d4ed8; box-shadow:0 8px 20px rgba(37,99,235,.34); color:#fff; }
.a3h-btn.ghost { background:#fff; color:var(--p); border:1.5px solid var(--line); box-shadow:none; }
.a3h-btn.ghost:hover { border-color:var(--p); }

/* ---- HERO ---- */
.a3h-hero { padding: 72px 0 84px; background:
    radial-gradient(1100px 520px at 80% -8%, #eef4ff 0%, rgba(238,244,255,0) 60%),
    radial-gradient(900px 480px at 0% 0%, #f5f8ff 0%, rgba(245,248,255,0) 55%), #ffffff; overflow:hidden; isolation:isolate; }
.a3h-orbit-scene { display:none; position:absolute; top:94px; width:calc(50% - 480px); height:560px;
    z-index:0; pointer-events:none; opacity:.72; }
.a3h-orbit-scene--left { left:0; }
.a3h-orbit-scene--right { right:0; }
.a3h-orbit-svg { display:block; width:100%; height:100%; overflow:visible; }
.a3h-orbit-path { fill:none; stroke-width:1.5; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.a3h-orbit-path--faint { stroke:#93c5fd; stroke-width:1; stroke-dasharray:3 9; opacity:.28; }
.a3h-orbit-object { transform-box:fill-box; transform-origin:center; }
@media (min-width:1500px) {
    .a3h-orbit-scene { display:block; }
}
.a3h-hero-grid { display:grid; grid-template-columns: 1.05fr .95fr; gap:48px; align-items:center; }
.a3h-badge { display:inline-flex; align-items:center; gap:.45em; font-size:.78rem; font-weight:var(--weight-accent);
    color:var(--p); background:#eff4ff; border:1px solid #dbe6ff; padding:.4rem .8rem; border-radius:999px; letter-spacing:.01em; }
.a3h-h1 { font-size:clamp(2.1rem,4vw,3.3rem); line-height:1.08; font-weight:var(--weight-title); margin:18px 0 0; letter-spacing:normal; }
.a3h-h1 .grad { color:#2563eb; font-weight:var(--weight-accent); }
.a3h-sub { font-size:1.1rem; color:var(--muted); line-height:1.6; margin:18px 0 0; max-width:540px; }
.a3h-hero-cta { display:flex; gap:14px; align-items:center; margin-top:28px; flex-wrap:wrap; }
.a3h-hero-note { font-size:.82rem; color:var(--muted); margin-top:14px; display:flex; gap:1.2em; flex-wrap:wrap; }
.a3h-hero-note span { display:inline-flex; align-items:center; gap:.4em; }
.a3h-hero-note svg { width:15px; height:15px; color:#22c55e; }

/* hero visual: rotating model + floating feature chips */
.a3h-stage { position:relative; aspect-ratio: 1/1; border-radius:24px;
    background: radial-gradient(circle at 50% 40%, #ffffff 0%, #eef2f9 100%);
    border:1px solid var(--line); box-shadow:0 20px 50px -28px rgba(17,24,39,.22); overflow:hidden; }
.a3h-stage model-viewer { width:100%; height:100%; --poster-color:transparent; background:transparent; }
.a3h-stage model-viewer::part(default-progress-bar) { display:none; }
.a3h-chip { position:absolute; z-index:3; background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
    border:1px solid var(--line); border-radius:12px; padding:.5rem .8rem; font-size:.8rem; font-weight:var(--weight-accent); color:var(--ink);
    box-shadow:0 10px 24px -10px rgba(17,24,39,.3); display:flex; align-items:center; gap:.5em; white-space:nowrap; }
.a3h-chip svg { width:16px; height:16px; color:var(--p); }
.a3h-chip.c1 { top:8%; left:-6%; } .a3h-chip.c2 { top:24%; right:-8%; }
.a3h-chip.c3 { bottom:20%; left:-8%; } .a3h-chip.c4 { bottom:7%; right:-4%; }

/* ---- trust strip ---- */
.a3h-trust { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--soft); }
.a3h-trust .a3h-wrap { display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; padding:22px 0; }
.a3h-trust-item { display:flex; align-items:center; gap:.6em; color:var(--muted); font-weight:var(--weight-title); font-size:.92rem; }
.a3h-trust-item svg { width:20px; height:20px; color:var(--p); }

/* ---- generic section ---- */
.a3h-sec { padding: 78px 0; }
.a3h-sec.alt { background:var(--soft); }
#features > .a3h-wrap,
#usecases > .a3h-wrap { max-width:1400px; }
.a3h-eyebrow { text-align:center; color:var(--p); font-weight:var(--weight-accent); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; }
.a3h-h2 { text-align:center; font-size:clamp(1.7rem,3vw,2.4rem); font-weight:var(--weight-title); letter-spacing:normal; margin:10px 0 0; }
.a3h-lead { text-align:center; color:var(--muted); font-size:1.05rem; max-width:640px; margin:16px auto 0; line-height:1.6; }

/* feature cards */
.a3h-grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; }
.a3h-card { background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; transition:border-color .12s, box-shadow .12s, transform .12s; }
.a3h-card:hover { border-color:#c7d7fe; box-shadow:0 12px 28px -18px rgba(17,24,39,.2); transform:translateY(-3px); }
.a3h-card-media { position:relative; aspect-ratio:16/9; overflow:hidden;
    background:radial-gradient(circle at 50% 42%,#ffffff 0%,#eef2f9 100%); border-bottom:1px solid var(--line); }
.a3h-card-media img { width:100%; height:100%; object-fit:cover; transition:transform .22s ease; }
.a3h-card:hover .a3h-card-media img { transform:scale(1.035); }
.a3h-card-ic { position:absolute; top:16px; left:16px; width:46px; height:46px; border-radius:12px;
    background:rgba(255,255,255,.92); border:1px solid rgba(219,230,255,.95); display:flex; align-items:center;
    justify-content:center; box-shadow:0 8px 20px -12px rgba(17,24,39,.35); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.a3h-card-ic svg { width:24px; height:24px; color:var(--p); }
.a3h-card-body { padding:22px 24px 24px; }
.a3h-card h3 { font-size:1.15rem; font-weight:var(--weight-title); margin:0 0 8px; }
.a3h-card p { color:var(--muted); font-size:.95rem; line-height:1.6; margin:0; }
.a3h-grid3--workflows { margin-top:24px; }

/* use cases */
.a3h-grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px; }
.a3h-use { border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; transition:transform .12s, box-shadow .12s; }
.a3h-use:hover { transform:translateY(-3px); box-shadow:0 16px 34px -22px rgba(17,24,39,.4); }
.a3h-use-top { height:120px; display:flex; align-items:center; justify-content:center;
    background:radial-gradient(circle at 50% 35%,#ffffff,#eef2f9); border-bottom:1px solid var(--line); }
.a3h-use-top svg { width:42px; height:42px; color:var(--p); }
.a3h-use-body { padding:18px; }
.a3h-use-body h3 { font-size:1.02rem; font-weight:var(--weight-title); margin:0 0 6px; }
.a3h-use-body p { color:var(--muted); font-size:.88rem; line-height:1.55; margin:0; }

/* FAQ */
.a3h-faq { max-width:820px; margin:44px auto 0; }
.a3h-q { border:1px solid var(--line); border-radius:12px; background:#fff; margin-bottom:12px; overflow:hidden; }
.a3h-q summary { cursor:pointer; list-style:none; padding:18px 22px; font-weight:var(--weight-title); font-size:1.02rem;
    display:flex; justify-content:space-between; align-items:center; gap:1em; }
.a3h-q summary::-webkit-details-marker { display:none; }
.a3h-q summary .a3h-q-ic { transition:transform .2s; color:var(--p); flex-shrink:0; }
.a3h-q[open] summary .a3h-q-ic { transform:rotate(45deg); }
.a3h-q-a { padding:0 22px 20px; color:var(--muted); line-height:1.65; font-size:.96rem; }

/* final CTA */
.a3h-cta { padding:84px 0; text-align:center;
    background:radial-gradient(800px 360px at 50% 0%, #eef4ff 0%, rgba(238,244,255,0) 70%), var(--soft); }
.a3h-cta h2 { font-size:clamp(1.8rem,3vw,2.6rem); font-weight:var(--weight-title); letter-spacing:normal; margin:0; }
.a3h-cta p { color:var(--muted); font-size:1.08rem; margin:16px auto 30px; max-width:560px; }

/* footer */
.a3h-foot { background:#fafafa; border-top:1px solid var(--line); color:#6b7280; padding:34px 0; text-align:center; font-size:.88rem; line-height:1.7; }
.a3h-foot a { color:#2563eb; }

/* ---- responsive ---- */
@media (max-width: 920px) {
    .a3h-hero-grid { grid-template-columns:1fr; gap:54px; }
    .a3h-stage { max-width:460px; margin:0 auto; }
    .a3h-grid3 { grid-template-columns:1fr; }
    .a3h-grid4 { grid-template-columns:1fr 1fr; }
    .a3h-chip.c1 { left:2%; } .a3h-chip.c2 { right:2%; } .a3h-chip.c3 { left:2%; } .a3h-chip.c4 { right:2%; }
}
@media (max-width: 540px) {
    .a3h-grid4 { grid-template-columns:1fr; }
    .a3h-hero { padding:48px 0 60px; }
}

/* ==== proof section: gallery ==== */
.a3h-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px; }
.a3h-gv { position:relative; aspect-ratio:1/1; border:1px solid var(--line); border-radius:16px; overflow:hidden;
    background:radial-gradient(circle at 50% 40%,#ffffff,#eef2f9); transition:transform .12s, box-shadow .12s; }
.a3h-gv:hover { transform:translateY(-3px); box-shadow:0 16px 34px -22px rgba(17,24,39,.4); }
.a3h-gv-poster,
.a3h-gv model-viewer { position:absolute; inset:0; width:100%; height:100%; }
.a3h-gv-poster { z-index:1; display:block; object-fit:contain; opacity:1; visibility:visible;
    user-select:none; transition:opacity .2s ease, visibility .2s ease; }
.a3h-gv model-viewer { z-index:2; opacity:0; pointer-events:none; --poster-color:transparent; background:transparent;
    filter:brightness(1.08) saturate(1.02); transition:opacity .2s ease; }
.a3h-gv.is-model-ready .a3h-gv-poster { opacity:0; visibility:hidden; }
.a3h-gv.is-model-ready model-viewer { opacity:1; pointer-events:auto; }
.a3h-gv.is-model-fallback model-viewer { opacity:0; visibility:hidden; pointer-events:none; }
.a3h-gv model-viewer.a3h-gv-model--dark { filter:brightness(1.22) saturate(1.04); }
.a3h-gv model-viewer::part(default-progress-bar) { display:none; }
.a3h-gv-tag { position:absolute; left:10px; bottom:10px; z-index:3; background:rgba(255,255,255,.92);
    -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:1px solid var(--line); border-radius:8px;
    padding:.25rem .6rem; font-size:.76rem; font-weight:var(--weight-title); color:var(--ink); }
.a3h-gallery-note { text-align:center; color:var(--muted); font-size:.84rem; margin-top:18px; }

@media (max-width:920px) {
    .a3h-gallery { grid-template-columns:1fr 1fr; }
}
@media (max-width:540px) {
    .a3h-gallery { grid-template-columns:1fr 1fr; }
}

/* ==== centered hero with upload window (light/blue, screenshot layout) ==== */
.a3h-hero-center { position:relative; z-index:1; max-width:960px; margin:0 auto; text-align:center; display:flex; flex-direction:column; align-items:center; }
.a3h-hero-center .a3h-h1 { margin-top:16px; }
.a3h-hero-center .a3h-h1 .grad { display:block; white-space:nowrap; }
.a3h-sub-center { margin:16px auto 0; max-width:560px; }
.a3h-note-center { justify-content:center; }
.a3h-upload { position:relative; isolation:isolate; width:100%; max-width:760px; min-height:300px; margin:34px auto 0; padding:46px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
    border:2px solid transparent; border-radius:28px; cursor:pointer; text-align:center;
    background:linear-gradient(#fff,#fff) padding-box,
        linear-gradient(135deg,#dbeafe 0%,#c7d7fe 52%,#93b4ff 100%) border-box;
    box-shadow:0 12px 18px -8px rgba(37,99,235,.16),0 28px 54px -38px rgba(37,99,235,.42);
    transition:box-shadow .2s ease,transform .2s ease; }
.a3h-upload::before { content:""; position:absolute; inset:12px; z-index:0; pointer-events:none;
    border:1px dashed #cbd5e1; border-radius:18px; background:#fff;
    transition:border-color .15s ease,background-color .15s ease; }
.a3h-upload > * { position:relative; z-index:1; }
.a3h-upload:hover { box-shadow:0 14px 22px -8px rgba(37,99,235,.22),0 32px 58px -38px rgba(37,99,235,.5); transform:translateY(-2px); }
.a3h-upload:hover::before { border-color:#a9bef6; background:#fbfdff; }
.a3h-upload.drag::before { border-color:var(--p); border-style:solid; background:#f3f7ff; }
.a3h-upload.invalid { background:linear-gradient(#fff,#fff) padding-box,
        linear-gradient(135deg,#fecaca 0%,#ef4444 100%) border-box; }
.a3h-upload.invalid::before { border-color:#ef4444; background:#fff7f7; }
.a3h-upload:focus-visible { outline:3px solid rgba(37,99,235,.28); outline-offset:4px; }
.a3h-upload-ic { width:64px; height:64px; border-radius:16px; background:#eff4ff; display:flex; align-items:center; justify-content:center; }
.a3h-upload-ic svg { width:30px; height:30px; color:var(--p); }
.a3h-upload-t { font-size:1.12rem; font-weight:var(--weight-title); color:var(--ink); margin-top:12px; }
.a3h-upload-s { font-size:.92rem; color:var(--muted); }
.a3h-upload-error { min-height:1.3em; margin-top:8px; color:#b91c1c; font-size:.88rem; font-weight:var(--weight-title); }
.a3h-upload-cta { margin-top:24px; font-size:1.05rem; padding:1rem 2.1rem; }
.a3h-hero-gallery { position:relative; z-index:1; width:92%; max-width:1400px; margin-top:34px; padding:20px 20px 16px; background:rgba(255,255,255,.82);
    border:1px solid #bfdbfe; border-radius:20px; box-shadow:0 18px 44px -34px rgba(37,99,235,.55); }
.a3h-hero-gallery .a3h-gallery { gap:14px; margin-top:0; }
.a3h-hero-gallery .a3h-gv { border-radius:14px; }
.a3h-hero-gallery .a3h-gallery-note { margin:14px 0 0; }
@media (max-width:540px) {
    .a3h-hero-center .a3h-h1 { font-size:clamp(1.4rem,6.8vw,2.1rem); }
    .a3h-upload { min-height:220px; padding:36px 24px; border-radius:22px; }
    .a3h-upload::before { inset:9px; border-radius:14px; }
    .a3h-hero-gallery { margin-top:26px; padding:10px 10px 12px; border-radius:16px; }
    .a3h-hero-gallery .a3h-gallery { gap:10px; }
    .a3h-hero-gallery .a3h-gv { border-radius:11px; }
}
