:root{--color-background: #ffffff;--color-background-secondary: #f5f5f7;--color-surface: #ffffff;--color-text-primary: #1d1d1f;--color-text-secondary: #86868b;--color-text-tertiary: #6e6e73;--color-accent: #007aff;--color-accent-hover: #0056cc;--color-accent-light: rgba(0, 122, 255, .1);--color-error: #ff3b30;--color-border: rgba(0, 0, 0, .1);--color-border-light: rgba(0, 0, 0, .05);--color-shadow: rgba(0, 0, 0, .1);--font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-hero: 56px;--font-size-large: 32px;--font-size-medium: 21px;--font-size-body: 17px;--font-size-small: 15px;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--spacing-xs: 8px;--spacing-sm: 16px;--spacing-md: 24px;--spacing-lg: 32px;--spacing-xl: 48px;--spacing-xxl: 64px;--spacing-xxxl: 96px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .12)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;background:var(--color-background);color:var(--color-text-primary);line-height:1.47059;font-size:var(--font-size-body);font-weight:var(--font-weight-regular)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.header{position:fixed;top:0;left:0;right:0;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border-light);z-index:1000;padding:var(--spacing-sm) 0}.nav{display:flex;align-items:center;justify-content:space-between}.logo a{font-size:var(--font-size-medium);font-weight:var(--font-weight-bold);color:var(--color-text-primary);text-decoration:none;letter-spacing:-.01em}.nav-menu{display:flex;list-style:none;gap:var(--spacing-lg);margin:0;padding:0}.nav-menu a{font-size:var(--font-size-body);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;transition:color .2s ease}.nav-menu a:hover{color:var(--color-accent)}.hero{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);padding:calc(var(--spacing-xxxl) + 60px) 0 var(--spacing-xxxl) 0;text-align:center}.hero-content{max-width:800px;margin:0 auto}.hero h1{font-size:var(--font-size-hero);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--spacing-md);letter-spacing:-.02em;line-height:1.08349}.hero-subhead{font-size:var(--font-size-medium);font-weight:var(--font-weight-regular);color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);line-height:1.28571;letter-spacing:-.01em}.viewer-demo{background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--spacing-xl);box-shadow:var(--shadow-lg);border:1px solid var(--color-border-light);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);max-width:600px;margin:0 auto}.input-group{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}#url-input{flex:1;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-body);font-weight:var(--font-weight-regular);color:var(--color-text-primary);background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-md);outline:none;transition:all .2s cubic-bezier(.25,.46,.45,.94);font-family:var(--font-family)}#url-input::placeholder{color:var(--color-text-tertiary)}#url-input:focus{border-color:var(--color-accent);box-shadow:0 0 0 4px var(--color-accent-light)}.primary-button{padding:var(--spacing-sm) var(--spacing-lg);font-size:var(--font-size-body);font-weight:var(--font-weight-semibold);color:#fff;background:var(--color-accent);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);font-family:var(--font-family);letter-spacing:-.01em;white-space:nowrap}.primary-button:hover{background:var(--color-accent-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.secondary-button{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-body);font-weight:var(--font-weight-medium);color:var(--color-accent);background:transparent;border:1.5px solid var(--color-accent);border-radius:var(--radius-md);cursor:pointer;transition:all .2s cubic-bezier(.25,.46,.45,.94);font-family:var(--font-family)}.secondary-button:hover{background:var(--color-accent-light);transform:translateY(-1px)}.error-message{color:var(--color-error);font-size:var(--font-size-small);font-weight:var(--font-weight-medium);text-align:center;min-height:20px;line-height:1.33333}.benefits{padding:var(--spacing-xxxl) 0;background:var(--color-background-secondary)}.benefits h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);text-align:center;margin-bottom:var(--spacing-xl);color:var(--color-text-primary)}.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-lg);max-width:1000px;margin:0 auto}.benefit-item{text-align:center;padding:var(--spacing-lg);background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border-light)}.benefit-icon{font-size:32px;margin-bottom:var(--spacing-md)}.benefit-item h3{font-size:var(--font-size-medium);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);color:var(--color-text-primary)}.benefit-item p{color:var(--color-text-secondary);font-size:var(--font-size-body);line-height:1.5}.how-it-works{padding:var(--spacing-xxxl) 0}.how-it-works h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);text-align:center;margin-bottom:var(--spacing-xl);color:var(--color-text-primary)}.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg);max-width:1000px;margin:0 auto}.step{text-align:center;padding:var(--spacing-lg)}.step-number{width:48px;height:48px;border-radius:50%;background:var(--color-accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-medium);font-weight:var(--font-weight-bold);margin:0 auto var(--spacing-md)}.step h3{font-size:var(--font-size-medium);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);color:var(--color-text-primary)}.step p{color:var(--color-text-secondary);font-size:var(--font-size-body);line-height:1.5}.detailed-description{padding:var(--spacing-xxxl) 0;background:var(--color-background)}.detailed-description h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);text-align:center;color:var(--color-text-primary);max-width:800px;margin-left:auto;margin-right:auto;margin-bottom:var(--spacing-xl)}.description-content{max-width:900px;margin:0 auto;font-size:var(--font-size-body);line-height:1.6;color:var(--color-text-primary)}.description-content p{margin-bottom:var(--spacing-lg);text-align:justify;-webkit-hyphens:auto;hyphens:auto}.description-content p:last-child{margin-bottom:0}.use-cases{padding:var(--spacing-xxxl) 0;background:var(--color-background-secondary)}.use-cases h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);text-align:center;margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.section-intro{text-align:center;font-size:var(--font-size-medium);color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);max-width:600px;margin-left:auto;margin-right:auto}.use-cases-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-md);max-width:1000px;margin:0 auto}.use-case{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border-light)}.use-case-icon{font-size:24px;flex-shrink:0}.use-case h3{font-size:var(--font-size-body);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.compatibility,.trust{padding:var(--spacing-xl) 0;text-align:center}.compatibility h2,.trust h2{font-size:var(--font-size-large);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.compatibility p,.trust p{font-size:var(--font-size-medium);color:var(--color-text-secondary);max-width:600px;margin:0 auto;line-height:1.5}.faq{padding:var(--spacing-xxxl) 0;background:var(--color-background-secondary)}.faq h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);text-align:center;margin-bottom:var(--spacing-xl);color:var(--color-text-primary)}.faq-list{max-width:800px;margin:0 auto}.faq-item{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-md);box-shadow:var(--shadow-sm);border:1px solid var(--color-border-light)}.faq-item h3{font-size:var(--font-size-medium);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);color:var(--color-text-primary)}.faq-item p{color:var(--color-text-secondary);font-size:var(--font-size-body);line-height:1.5}#fullscreen-viewer{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000;z-index:9999;margin:0;padding:0;border:none;outline:none}#viewer-frame{width:100%;height:100%;border:0;background:#fff;position:absolute;top:0;left:0;transition:opacity .3s ease;margin:0;padding:0;outline:none}.close-button{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);z-index:1000;width:32px;height:32px;border-radius:50%;border:none;background:#0009;color:#fff;cursor:pointer;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:16px;font-weight:700;position:fixed}.close-button.visible{opacity:1}.close-button:hover{background:#000c;transform:scale(1.1)}@media (max-width: 768px){.nav-menu{gap:var(--spacing-md)}.nav-menu a{font-size:var(--font-size-small)}.hero h1{font-size:36px}.hero-subhead{font-size:var(--font-size-body)}.input-group{flex-direction:column}.benefits-grid,.steps,.use-cases-grid{grid-template-columns:1fr}.use-case{flex-direction:column;text-align:center}}@media (max-width: 480px){.nav{flex-direction:column;gap:var(--spacing-sm)}.nav-menu{gap:var(--spacing-sm)}.header{padding:var(--spacing-xs) 0}.hero{padding:calc(var(--spacing-xl) + 80px) 0 var(--spacing-xl) 0}.container{padding:0 var(--spacing-sm)}.hero{padding:var(--spacing-xl) 0}.kiosk-demo{padding:var(--spacing-md)}.hero h1{font-size:28px}}@media (prefers-color-scheme: dark){:root{--color-background: #000000;--color-background-secondary: #1c1c1e;--color-surface: #2c2c2e;--color-text-primary: #ffffff;--color-text-secondary: #98989d;--color-text-tertiary: #8e8e93;--color-border: rgba(255, 255, 255, .1);--color-border-light: rgba(255, 255, 255, .05);--color-shadow: rgba(0, 0, 0, .3)}.header{background:#000000f2}.hero{background:linear-gradient(135deg,#1c1c1e,#2c2c2e)}}#fullscreen-viewer:fullscreen{background:#000;width:100vw;height:100vh;margin:0;padding:0}#fullscreen-viewer:-webkit-full-screen{background:#000;width:100vw;height:100vh;margin:0;padding:0}#fullscreen-viewer:-moz-full-screen{background:#000;width:100vw;height:100vh;margin:0;padding:0}#fullscreen-viewer:-ms-fullscreen{background:#000;width:100vw;height:100vh;margin:0;padding:0}#fullscreen-viewer:fullscreen #viewer-frame,#fullscreen-viewer:-webkit-full-screen #viewer-frame,#fullscreen-viewer:-moz-full-screen #viewer-frame,#fullscreen-viewer:-ms-fullscreen #viewer-frame{width:100vw;height:100vh;border:0;margin:0;padding:0}#fullscreen-viewer:fullscreen .close-button,#fullscreen-viewer:-webkit-full-screen .close-button,#fullscreen-viewer:-moz-full-screen .close-button,#fullscreen-viewer:-ms-fullscreen .close-button{position:fixed;top:16px;right:16px;z-index:1000000}#fullscreen-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10000;display:flex;align-items:center;justify-content:center}.fullscreen-content{background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--spacing-xl);max-width:500px;text-align:center;box-shadow:var(--shadow-lg);border:1px solid var(--color-border)}.fullscreen-content h2{font-size:var(--font-size-large);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.fullscreen-content p{color:var(--color-text-secondary);margin-bottom:var(--spacing-md);line-height:1.5}.fullscreen-options{margin:var(--spacing-lg) 0}.fullscreen-options button{width:100%;margin-bottom:var(--spacing-sm)}.or-text{font-size:var(--font-size-small);color:var(--color-text-tertiary);margin:var(--spacing-md) 0 var(--spacing-sm) 0}.keyboard-hint{font-size:var(--font-size-small);margin-bottom:var(--spacing-sm)}.keyboard-hint kbd{background:var(--color-background-secondary);border:1px solid var(--color-border);border-radius:4px;padding:2px 6px;font-family:monospace;font-size:var(--font-size-small)}.cancel-button{background:transparent;border:none;color:var(--color-text-tertiary);font-size:var(--font-size-small);cursor:pointer;margin-top:var(--spacing-md);padding:var(--spacing-sm)}.cancel-button:hover{color:var(--color-text-secondary)}
