
:root {
  --bg: #070a12;
  --bg-2: #0c1120;
  --surface: rgba(255,255,255,.075);
  --surface-2: rgba(255,255,255,.105);
  --surface-strong: rgba(255,255,255,.16);
  --text: #f5f7fb;
  --muted: #aab5c8;
  --soft: #dce6fb;
  --line: rgba(255,255,255,.14);
  --brand: #63e6ff;
  --brand-2: #7c5cff;
  --brand-3: #21f0a2;
  --danger: #ff7a90;
  --success: #45f0a9;
  --shadow: 0 24px 80px rgba(0,0,0,.36);
  --radius: 28px;
  --radius-lg: 38px;
  --container: 1180px;
  --header: 82px;
  --ease: cubic-bezier(.22,1,.36,1);
}

html[data-theme="light"] {
  --bg: #f5f8ff;
  --bg-2: #eaf0fb;
  --surface: rgba(255,255,255,.72);
  --surface-2: rgba(255,255,255,.86);
  --surface-strong: rgba(255,255,255,.96);
  --text: #081223;
  --muted: #526176;
  --soft: #152238;
  --line: rgba(18,34,60,.12);
  --brand: #026dff;
  --brand-2: #6a44ff;
  --brand-3: #00a66e;
  --shadow: 0 24px 80px rgba(23,50,94,.15);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 14% 5%, rgba(99,230,255,.18), transparent 28rem),
    radial-gradient(circle at 86% 10%, rgba(124,92,255,.22), transparent 30rem),
    linear-gradient(180deg, var(--bg), var(--bg-2) 52%, var(--bg));
  overflow-x: hidden;
  line-height: 1.6;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
::selection { background: rgba(99,230,255,.32); color: var(--text); }

.site-noise { position: fixed; inset: 0; pointer-events: none; opacity: .045; z-index: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E"); }
.orb { position: fixed; width: 26rem; height: 26rem; border-radius: 999px; filter: blur(62px); opacity: .18; pointer-events: none; z-index: 0; animation: drift 18s ease-in-out infinite alternate; }
.orb-one { left: -10rem; top: 18rem; background: var(--brand); }
.orb-two { right: -8rem; top: 44rem; background: var(--brand-2); animation-delay: -8s; }
@keyframes drift { to { transform: translate3d(4rem, -3rem, 0) scale(1.15); } }

.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; position: relative; z-index: 1; }
.narrow { width: min(calc(100% - 40px), 920px); text-align: center; }
.section { padding: 106px 0; position: relative; }
.page-hero { padding: 164px 0 88px; position: relative; overflow: hidden; }
.page-hero::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 50% 0, rgba(99,230,255,.20), transparent 36rem); pointer-events:none; }
.page-hero h1, .hero h1 { font-size: clamp(2.75rem, 8vw, 6.8rem); line-height: .9; letter-spacing: -.07em; margin: 0; text-wrap: balance; }
.page-hero p, .hero-lead { font-size: clamp(1.05rem, 1.8vw, 1.35rem); color: var(--muted); max-width: 760px; margin: 22px auto 0; }

.topbar { position: fixed; inset: 0 0 auto 0; height: var(--header); z-index: 50; transition: background .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease); border-bottom: 1px solid transparent; }
.topbar.scrolled, .topbar.menu-open { background: color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter: blur(20px); border-color: var(--line); box-shadow: 0 14px 40px rgba(0,0,0,.12); }
.nav { height: var(--header); display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.brand, .footer-brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand-mark { width: 44px; height: 44px; border-radius: 16px; display: grid; place-items: center; background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.04)); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 12px 28px rgba(0,0,0,.18); }
.brand-mark img { width: 28px; height: 28px; object-fit: contain; }
.brand-copy { display: grid; line-height: 1.05; }
.brand-copy strong { font-size: .96rem; letter-spacing: -.02em; }
.brand-copy span { color: var(--muted); font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; }
.nav-links { display: flex; align-items: center; gap: 7px; padding: 7px; border: 1px solid var(--line); background: rgba(255,255,255,.045); border-radius: 999px; backdrop-filter: blur(18px); }
.nav-links a { color: var(--muted); font-size: .9rem; padding: 10px 14px; border-radius: 999px; transition: color .25s, background .25s, transform .25s; }
.nav-links a:hover, .nav-links a.active { color: var(--text); background: var(--surface); transform: translateY(-1px); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.theme-toggle, .mobile-toggle { border: 1px solid var(--line); background: var(--surface); height: 44px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; backdrop-filter: blur(14px); transition: transform .25s, background .25s; }
.theme-toggle { padding: 0 14px; }
.theme-toggle:hover, .mobile-toggle:hover { transform: translateY(-1px); background: var(--surface-2); }
.theme-toggle small { color: var(--muted); font-size: .75rem; }
.nav-cta { height: 44px; padding: 0 18px; border-radius: 999px; display: inline-flex; align-items: center; background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #fff; font-weight: 750; box-shadow: 0 12px 30px color-mix(in srgb, var(--brand) 22%, transparent); }
.mobile-toggle { display: none; width: 48px; flex-direction: column; }
.mobile-toggle span { width: 18px; height: 2px; border-radius: 99px; background: currentColor; transition: transform .25s, opacity .25s; }
.mobile-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
.mobile-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }
.mobile-panel { display: none; }

.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 100; background: linear-gradient(90deg, var(--brand), var(--brand-2), var(--brand-3)); box-shadow: 0 0 28px var(--brand); }
.cursor-glow { position: fixed; width: 360px; height: 360px; border-radius: 999px; pointer-events: none; z-index: 0; background: radial-gradient(circle, rgba(99,230,255,.13), transparent 62%); transform: translate(-50%, -50%); opacity: .8; mix-blend-mode: screen; }

.hero { padding: 160px 0 90px; min-height: 100vh; display: grid; align-items: center; position: relative; overflow: hidden; }
.hero-grid, .about-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr); gap: 60px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--brand); font-weight: 850; letter-spacing: .13em; text-transform: uppercase; font-size: .74rem; }
.eyebrow span { width: 28px; height: 1px; background: currentColor; box-shadow: 0 0 18px currentColor; }
.hero-copy h1 { margin-top: 16px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 34px; }
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 22px; border-radius: 999px; border: 1px solid var(--line); font-weight: 800; overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease); }
.btn::after { content:""; position:absolute; inset:0; background: linear-gradient(120deg, transparent, rgba(255,255,255,.22), transparent); transform: translateX(-120%); transition: transform .7s var(--ease); }
.btn:hover::after { transform: translateX(120%); }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #fff; box-shadow: 0 20px 48px color-mix(in srgb, var(--brand) 24%, transparent); }
.btn-secondary { background: var(--surface); color: var(--text); backdrop-filter: blur(18px); }
.btn-full { width: 100%; }
.btn-small { min-height: 40px; padding: 0 14px; font-size: .86rem; }
.hero-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 42px; max-width: 650px; }
.hero-metrics div { padding: 18px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); backdrop-filter: blur(14px); }
.hero-metrics strong { display:block; font-size: 1.2rem; }
.hero-metrics span { color: var(--muted); font-size: .86rem; }

.hero-visual, .device-scene, .founder-visual { perspective: 1200px; min-height: 560px; display:grid; place-items:center; }
.holo-stage { width: min(100%, 520px); height: 520px; position: relative; transform-style: preserve-3d; border-radius: 46px; }
.holo-stage::before { content:""; position:absolute; inset: 30px; border-radius: 46px; background: radial-gradient(circle at 50% 30%, rgba(99,230,255,.24), rgba(124,92,255,.11) 45%, transparent 70%); filter: blur(8px); transform: translateZ(-60px); }
.dashboard-card, .mini-card, .floating-chip, .case-card, .device-note { position: absolute; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.055)); backdrop-filter: blur(22px); box-shadow: var(--shadow); }
.dashboard-main { inset: 76px 42px auto 42px; min-height: 330px; border-radius: 34px; padding: 22px; transform: rotateX(8deg) rotateY(-12deg) translateZ(50px); }
.dash-header { display:flex; gap:8px; margin-bottom: 26px; }
.dash-header span { width: 11px; height: 11px; border-radius: 50%; background: var(--line); }
.dash-title { font-weight: 900; font-size: 1.1rem; margin-bottom: 24px; }
.dash-graph { height: 128px; display:flex; align-items:end; gap:12px; padding:18px; border-radius: 24px; background: rgba(0,0,0,.18); border:1px solid var(--line); }
.dash-graph i { flex:1; border-radius: 999px 999px 8px 8px; min-height:28%; background: linear-gradient(180deg, var(--brand), var(--brand-2)); animation: bars 3.6s ease-in-out infinite alternate; }
.dash-graph i:nth-child(2) { min-height:72%; animation-delay:.2s; }
.dash-graph i:nth-child(3) { min-height:46%; animation-delay:.4s; }
.dash-graph i:nth-child(4) { min-height:88%; animation-delay:.6s; }
.dash-graph i:nth-child(5) { min-height:58%; animation-delay:.8s; }
@keyframes bars { to { transform: scaleY(.78); filter: brightness(1.2); } }
.dash-list { display:grid; gap:10px; margin-top:22px; }
.dash-list span { height: 12px; border-radius: 99px; background: var(--surface-strong); }
.dash-list span:nth-child(2) { width: 76%; }
.dash-list span:nth-child(3) { width: 48%; }
.mini-card { width: 170px; padding: 18px; border-radius: 26px; transform: translateZ(92px); }
.mini-card strong { font-size: 2.1rem; line-height: 1; display:block; }
.mini-card span { color: var(--muted); font-size:.85rem; }
.mini-top { top: 18px; right: 0; animation: float 6s ease-in-out infinite; }
.mini-bottom { left: 0; bottom: 52px; animation: float 7s ease-in-out infinite reverse; }
.floating-chip { padding: 10px 14px; border-radius: 999px; font-size: .82rem; font-weight: 800; color: var(--soft); }
.chip-a { top: 74px; left: 0; }
.chip-b { right: 18px; bottom: 126px; }
.chip-c { left: 142px; bottom: 20px; }
.orbit-ring { position:absolute; inset:34px; border:1px solid color-mix(in srgb, var(--brand) 34%, transparent); border-radius:50%; transform: rotateX(70deg) translateZ(-20px); box-shadow: 0 0 48px rgba(99,230,255,.12); animation: spin 18s linear infinite; }
@keyframes spin { to { rotate: 1turn; } }
@keyframes float { 50% { transform: translateY(-16px) translateZ(92px); } }

.logo-strip { padding: 18px 0; }
.strip-grid { display:grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding: 12px; border:1px solid var(--line); border-radius: 999px; background: var(--surface); backdrop-filter: blur(18px); }
.strip-grid span { text-align:center; color: var(--muted); font-weight: 800; font-size:.86rem; }
.section-grid { display:grid; grid-template-columns: .9fr 1.1fr; gap: 40px; align-items:end; margin-bottom: 34px; }
.section h2, .page-hero h1 { text-wrap: balance; }
.section h2 { font-size: clamp(2rem, 5vw, 4.4rem); line-height: .96; letter-spacing: -.055em; margin: 12px 0 0; }
.section-head.center { text-align:center; max-width: 840px; margin: 0 auto 44px; }
.section-head.center .eyebrow { justify-content:center; }
.section-head.center p, .text-block p, .feature-copy p, .split-card p, .cta-card p { color: var(--muted); font-size: 1.05rem; }
.card-grid { display:grid; gap: 18px; }
.card-grid.three, .service-grid, .industry-grid, .values-grid, .example-grid { grid-template-columns: repeat(3, 1fr); }
.glass-card, .service-card, .detail-card, .industry-card, .value-card, .example-card, .cta-card, .split-card, .process-panel, .case-hero, .contact-form, .contact-side, .legal-card { border: 1px solid var(--line); background: linear-gradient(145deg, var(--surface-2), color-mix(in srgb, var(--surface) 70%, transparent)); backdrop-filter: blur(22px); border-radius: var(--radius); box-shadow: var(--shadow); }
.glass-card { padding: 28px; min-height: 260px; transform-style: preserve-3d; }
.card-number, .service-card span, .detail-card > span, .industry-card span, .value-card span, .example-card span, .process-grid span { display:inline-flex; align-items:center; justify-content:center; min-width: 46px; height: 34px; padding: 0 12px; border-radius: 999px; background: color-mix(in srgb, var(--brand) 18%, transparent); color: var(--brand); font-weight: 900; font-size: .82rem; border:1px solid color-mix(in srgb, var(--brand) 28%, transparent); }
.glass-card h3, .service-card h3, .detail-card h3, .industry-card h3, .value-card h3, .example-card h3 { font-size: 1.3rem; line-height:1.1; margin: 28px 0 10px; letter-spacing: -.025em; }
.glass-card p, .service-card p, .detail-card p, .industry-card p, .value-card p, .example-card p { color: var(--muted); margin: 0; }
.feature-section { overflow:hidden; }
.feature-grid { display:grid; grid-template-columns: .95fr 1.05fr; gap: 70px; align-items:center; }
.feature-grid.reverse { grid-template-columns: 1.05fr .95fr; }
.check-list { list-style:none; padding:0; margin: 24px 0 0; display:grid; gap: 12px; }
.check-list li { position: relative; padding-left: 32px; color: var(--soft); }
.check-list li::before { content:""; position:absolute; left:0; top:.33em; width: 18px; height: 18px; border-radius:50%; background: linear-gradient(135deg, var(--brand-3), var(--brand)); box-shadow: 0 0 24px color-mix(in srgb, var(--brand-3) 40%, transparent); }
.device-scene { min-height: 600px; position:relative; }
.phone-3d { width: 285px; height: 560px; border-radius: 42px; padding: 14px; background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.06)); border: 1px solid var(--line); box-shadow: var(--shadow); transform: rotateY(-14deg) rotateX(8deg); }
.phone-speaker { width: 72px; height: 6px; border-radius:999px; background: var(--line); margin: 6px auto 14px; }
.phone-screen { height: calc(100% - 26px); border-radius: 30px; background: linear-gradient(180deg, rgba(6,10,20,.94), rgba(12,20,38,.92)); padding: 18px; border:1px solid rgba(255,255,255,.12); overflow:hidden; }
.app-top { font-weight: 900; margin-bottom: 18px; }
.scan-box { position:relative; min-height: 158px; border:1px dashed rgba(99,230,255,.45); border-radius: 22px; display:grid; place-items:center; text-align:center; overflow:hidden; background: rgba(99,230,255,.07); }
.scan-box span { position:absolute; left:8%; right:8%; height:2px; background: var(--brand); box-shadow: 0 0 22px var(--brand); animation: scan 2.6s ease-in-out infinite; }
@keyframes scan { 0%,100%{ top:20%; } 50%{ top:78%; } }
.scan-box strong, .scan-box small { grid-column:1; }
.scan-box small { color: var(--muted); }
.app-row { display:flex; justify-content:space-between; margin-top: 14px; padding: 12px; border-radius: 16px; background: rgba(255,255,255,.06); }
.app-row span { color: var(--muted); }
.app-total { margin-top: 18px; padding: 16px; border-radius: 20px; background: linear-gradient(135deg, var(--brand), var(--brand-2)); color:#fff; font-weight:900; text-align:center; font-size:1.35rem; }
.device-note { padding: 13px 16px; border-radius: 999px; font-weight: 900; }
.note-left { left: 9%; top: 20%; animation: float 6s ease-in-out infinite; }
.note-right { right: 5%; bottom: 24%; animation: float 7s ease-in-out infinite reverse; }

.service-grid { display:grid; gap: 16px; }
.service-card { padding: 26px; min-height: 245px; transition: transform .28s var(--ease), background .28s; position:relative; overflow:hidden; }
.service-card::after, .detail-card::after, .industry-card::after { content:""; position:absolute; inset:auto -40px -50px auto; width:140px; height:140px; background: radial-gradient(circle, color-mix(in srgb, var(--brand) 20%, transparent), transparent 68%); transition: transform .35s; }
.service-card:hover, .detail-card:hover, .industry-card:hover, .example-card:hover { transform: translateY(-6px); }
.service-card:hover::after, .detail-card:hover::after, .industry-card:hover::after { transform: scale(1.45); }
.dark-panel-section { padding-top: 70px; padding-bottom: 70px; }
.process-panel { padding: clamp(28px, 5vw, 56px); position:relative; overflow:hidden; }
.process-panel::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 50% 0, rgba(124,92,255,.20), transparent 38rem); pointer-events:none; }
.process-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.process-grid div { padding: 24px; border-radius: 24px; background: rgba(255,255,255,.06); border:1px solid var(--line); position:relative; z-index:1; }
.process-grid h3 { margin: 26px 0 8px; font-size: 1.26rem; }
.process-grid p { margin:0; color:var(--muted); }
.quickcheck-grid { display:grid; grid-template-columns: .85fr 1.15fr; gap: 38px; align-items:start; }
.quickcheck-cards { display:grid; gap: 14px; }
.quick-card { text-align:left; width:100%; padding: 22px; border-radius: 24px; border:1px solid var(--line); background: var(--surface); color: var(--text); font-weight: 850; display:flex; gap:16px; align-items:center; transition: transform .25s, background .25s; }
.quick-card:hover { transform: translateX(8px); background: var(--surface-2); }
.quick-card span { color: var(--brand); }
.final-cta { padding-top: 60px; }
.cta-card { padding: clamp(32px, 6vw, 68px); text-align:center; overflow:hidden; position:relative; }
.cta-card::before { content:""; position:absolute; inset: -40% -10% auto; height: 280px; background: radial-gradient(circle, rgba(99,230,255,.20), transparent 65%); pointer-events:none; }
.cta-card .eyebrow { justify-content:center; }
.cta-card h2 { max-width: 920px; margin-inline:auto; }
.cta-card p { max-width: 720px; margin: 16px auto 28px; }

.service-detail-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.detail-card { padding: 30px; position:relative; overflow:hidden; scroll-margin-top: 120px; }
.detail-card h3 { font-size: 1.55rem; }
.detail-card ul { margin: 22px 0 0; padding: 0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.detail-card li { padding: 8px 10px; border-radius: 999px; background: var(--surface); color: var(--muted); font-size:.85rem; border:1px solid var(--line); }
.code-window { border-radius: 30px; border:1px solid var(--line); background: rgba(3,7,14,.72); box-shadow: var(--shadow); overflow:hidden; }
.code-bar { display:flex; gap:8px; padding: 16px; border-bottom:1px solid rgba(255,255,255,.1); }
.code-bar i { width:12px; height:12px; border-radius:50%; background: rgba(255,255,255,.22); }
.code-window pre { margin:0; padding: 34px; white-space:pre-wrap; color: #cdeaff; font-size: clamp(.95rem, 2vw, 1.2rem); }
.split-card { display:grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: clamp(28px, 5vw, 46px); align-items:center; }

.case-hero { display:grid; grid-template-columns: .95fr 1.05fr; gap: 40px; padding: clamp(28px, 5vw, 54px); align-items:center; overflow:hidden; }
.case-stack { min-height: 360px; position:relative; perspective: 1000px; }
.case-card { left: 15%; right: 15%; height: 96px; border-radius: 28px; display:grid; place-items:center; font-weight: 900; }
.card-one { top: 22px; transform: rotate(-5deg) translateZ(10px); }
.card-two { top: 132px; transform: rotate(4deg) translateZ(40px); }
.card-three { top: 242px; transform: rotate(-2deg) translateZ(70px); background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #fff; }
.example-grid { display:grid; gap: 16px; }
.example-card { padding: 26px; min-height: 260px; position:relative; overflow:hidden; }
.example-card b { display:inline-flex; margin-top: 20px; color: var(--success); }
.stacked-steps { display:grid; gap: 14px; }
.stacked-steps div { padding: 22px; border-radius: 24px; border: 1px solid var(--line); background: var(--surface); }
.stacked-steps span { color: var(--brand); font-weight: 900; }
.stacked-steps h3 { margin: 8px 0 4px; }
.stacked-steps p { margin: 0; color: var(--muted); }
.industry-grid, .values-grid { display:grid; gap: 16px; }
.industry-card, .value-card { padding: 28px; min-height: 230px; position:relative; overflow:hidden; }
.flow-orbit { min-height: 430px; position:relative; display:grid; place-items:center; }
.flow-orbit div { width: 270px; height: 270px; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--brand) 32%, transparent); box-shadow: 0 0 60px rgba(99,230,255,.10); animation: spin 20s linear infinite; }
.flow-orbit span { position:absolute; padding: 12px 16px; border-radius: 999px; background: var(--surface-2); border:1px solid var(--line); font-weight:900; box-shadow: var(--shadow); }
.flow-orbit span:nth-child(1) { top: 32px; left: 20%; }
.flow-orbit span:nth-child(2) { top: 42%; right: 10%; color: var(--brand); }
.flow-orbit span:nth-child(3) { bottom: 34px; left: 28%; }
.flow-orbit span:nth-child(4) { top: 44%; left: 8%; }
.about-hero { min-height: auto; padding-bottom: 70px; }
.about-grid { grid-template-columns: 1fr .82fr; }
.founder-visual { min-height: 430px; }
.founder-core { width: 330px; height: 330px; border-radius: 50%; position:relative; display:grid; place-items:center; background: radial-gradient(circle at 40% 30%, rgba(255,255,255,.20), rgba(99,230,255,.10) 45%, rgba(124,92,255,.09)); border:1px solid var(--line); box-shadow: var(--shadow); }
.founder-core img { width: 190px; filter: drop-shadow(0 18px 34px rgba(0,0,0,.28)); }
.founder-core span { position:absolute; width: 16px; height: 16px; border-radius:50%; background: var(--brand); box-shadow: 0 0 30px var(--brand); animation: spin 9s linear infinite; transform-origin: 0 165px; }
.founder-core span:nth-child(2){ top:0; left:50%; }
.founder-core span:nth-child(3){ bottom:36px; left:16%; animation-duration: 12s; }
.founder-core span:nth-child(4){ right:8%; top:58%; animation-duration: 15s; }

.contact-hero .contact-pills { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top: 26px; }
.contact-pills span { padding: 9px 12px; border-radius: 999px; border:1px solid var(--line); background: var(--surface); color: var(--muted); }
.contact-layout { display:grid; grid-template-columns: .82fr 1.18fr; gap: 22px; align-items:start; }
.contact-side, .contact-form { padding: clamp(24px, 4vw, 36px); }
.info-list { display:grid; gap: 12px; margin-top: 26px; }
.info-list div { padding: 16px; border-radius: 18px; background: var(--surface); border:1px solid var(--line); }
.info-list strong, .info-list span { display:block; }
.info-list span { color: var(--muted); font-size:.92rem; }
.contact-prefill { margin-bottom: 18px; padding: 16px; border:1px solid color-mix(in srgb, var(--brand) 32%, transparent); background: color-mix(in srgb, var(--brand) 10%, transparent); border-radius: 18px; }
.contact-prefill p { margin: 0 0 12px; color: var(--soft); }
.form-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.field { display:grid; gap: 8px; }
.field-full { grid-column: 1 / -1; }
.field span { color: var(--soft); font-weight: 750; font-size:.92rem; }
input, select, textarea { width:100%; border:1px solid var(--line); background: rgba(255,255,255,.07); border-radius: 16px; min-height: 52px; padding: 13px 14px; outline:none; transition: border-color .25s, box-shadow .25s, background .25s; }
textarea { resize: vertical; min-height: 170px; }
input:focus, select:focus, textarea:focus { border-color: color-mix(in srgb, var(--brand) 60%, var(--line)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 14%, transparent); background: rgba(255,255,255,.10); }
.field.invalid input, .field.invalid select, .field.invalid textarea { border-color: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 14%, transparent); }
.checkbox-line { display:flex; align-items:flex-start; gap: 10px; margin-top: 16px; color: var(--muted); }
.checkbox-line input { width: 19px; height: 19px; min-height: 0; margin-top: .2em; accent-color: var(--brand); }
.hp-field { position:absolute; left:-9999px; opacity:0; pointer-events:none; }
.contact-summary-panel { display:grid; grid-template-columns: 1fr auto; gap: 20px; align-items:end; margin-top: 24px; padding-top: 22px; border-top:1px solid var(--line); }
.contact-summary-panel h3 { margin:0 0 8px; }
.contact-summary { color: var(--muted); font-size:.94rem; }
.contact-response { display:grid; gap: 10px; justify-items:end; }
.contact-response span { color: var(--muted); font-size:.85rem; max-width: 310px; text-align:right; }
button[disabled] { opacity:.55; cursor:not-allowed; transform:none !important; }
.inline-contact { align-items:center; }
.legal-section { padding-top: 60px; }
.legal-card { padding: clamp(28px, 5vw, 54px); max-width: 940px; }
.legal-card h2 { font-size: clamp(1.35rem, 3vw, 2rem); margin: 32px 0 8px; letter-spacing: -.03em; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card p { color: var(--muted); }
.redirect-page { min-height:100vh; display:grid; place-items:center; padding: 40px 0; }
.footer { padding: 70px 0 26px; border-top:1px solid var(--line); position:relative; z-index:1; background: rgba(0,0,0,.08); }
.footer-grid { display:grid; grid-template-columns: 1.4fr repeat(3, .72fr); gap: 34px; }
.footer-main p { color: var(--muted); max-width: 430px; }
.footer-col { display:flex; flex-direction:column; gap: 8px; color: var(--muted); }
.footer-col h3 { margin:0 0 8px; color: var(--text); font-size: .9rem; letter-spacing:.1em; text-transform:uppercase; }
.footer-col a:hover { color: var(--brand); }
.footer-bottom { display:flex; justify-content:space-between; gap: 18px; margin-top: 44px; padding-top: 20px; border-top:1px solid var(--line); color: var(--muted); font-size:.86rem; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .12s; }
.delay-2 { transition-delay: .22s; }
.tilt-card { transform-style: preserve-3d; will-change: transform; }

@media (max-width: 1080px) {
  .nav-links, .nav-cta { display:none; }
  .mobile-toggle { display:flex; }
  .mobile-panel { display:block; position:fixed; left:0; right:0; top:var(--header); padding: 0 0 18px; opacity:0; pointer-events:none; transform: translateY(-12px); transition: opacity .25s, transform .25s; background: color-mix(in srgb, var(--bg) 86%, transparent); backdrop-filter: blur(22px); border-bottom:1px solid var(--line); }
  .mobile-panel.open { opacity:1; pointer-events:auto; transform: translateY(0); }
  .mobile-links { display:grid; gap:8px; margin: 12px 0; }
  .mobile-links a { padding: 15px 16px; border-radius: 16px; background: var(--surface); color: var(--muted); border:1px solid var(--line); }
  .mobile-links a.active { color: var(--text); background: var(--surface-2); }
  .hero-grid, .about-grid, .feature-grid, .feature-grid.reverse, .section-grid, .quickcheck-grid, .case-hero, .contact-layout, .split-card { grid-template-columns: 1fr; }
  .hero { padding-top: 134px; min-height: auto; }
  .hero-visual, .device-scene { min-height: 500px; }
  .strip-grid { grid-template-columns: repeat(3, 1fr); border-radius: 28px; }
  .service-detail-grid, .service-grid, .industry-grid, .values-grid, .example-grid, .card-grid.three { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  :root { --header: 74px; }
  .container, .narrow { width: min(calc(100% - 28px), var(--container)); }
  .brand-copy span { display:none; }
  .theme-toggle small { display:none; }
  .theme-toggle { width:44px; padding:0; }
  .hero, .page-hero { padding-top: 116px; padding-bottom: 56px; }
  .section { padding: 72px 0; }
  .page-hero h1, .hero h1 { font-size: clamp(2.55rem, 15vw, 4.6rem); }
  .hero-actions, .contact-pills { flex-direction:column; align-items:stretch; }
  .btn { width:100%; }
  .hero-metrics, .service-detail-grid, .service-grid, .industry-grid, .values-grid, .example-grid, .card-grid.three, .process-grid, .form-grid, .contact-summary-panel, .footer-grid { grid-template-columns: 1fr; }
  .strip-grid { grid-template-columns: 1fr; border-radius: 24px; }
  .hero-visual, .device-scene { min-height: 430px; }
  .holo-stage { height: 430px; }
  .dashboard-main { inset: 70px 10px auto; min-height: 260px; }
  .mini-card { width: 144px; }
  .mini-top { right: -4px; }
  .mini-bottom { left: -4px; bottom: 42px; }
  .floating-chip { display:none; }
  .phone-3d { width: 250px; height: 500px; transform: none; }
  .note-left, .note-right { display:none; }
  .case-card { left: 4%; right:4%; }
  .contact-response { justify-items:stretch; }
  .contact-response span { text-align:left; max-width:none; }
  .footer-bottom { flex-direction:column; }
  .cursor-glow { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }
  .cursor-glow { display:none; }
}
