@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap";:root{font-weight:400;line-height:1.5}body{width:100%;min-width:320px;min-height:100vh;margin:0;padding:0}#root{width:100%;max-width:none;margin:0;padding:0}:root{--color-primary:#006041;--color-text:#222;--color-muted:#4c4c4c;--color-surface:#f3f5f7;--color-border:#e7e9eb;--page-width:1100px;--page-gutter:clamp(20px,4vw,40px);--section-space:clamp(72px,10vw,128px)}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{color:var(--color-text);padding-top:74px;font-family:Plus Jakarta Sans,sans-serif;overflow-x:hidden}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}img,video,iframe{max-width:100%}#root,.app{width:100%}.hero-container,.features-section,.categories-section,.upload-section{width:min(100%,calc(var(--page-width) + (var(--page-gutter)*2)));padding-inline:var(--page-gutter);margin-inline:auto}.nav{z-index:100;border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff5;width:100%;position:fixed;inset:0 0 auto}.nav-container{width:min(100%,calc(var(--page-width) + (var(--page-gutter)*2)));min-height:74px;padding:12px var(--page-gutter);justify-content:space-between;align-items:center;gap:24px;margin-inline:auto;display:flex;position:relative}.nav-logo{flex-shrink:0;align-items:center;display:inline-flex}.nav-logo img{width:auto;height:40px;display:block}.nav-menu{align-items:center;gap:32px;margin-left:auto;display:flex}.nav-links{align-items:center;gap:32px;margin:0;padding:0;list-style:none;display:flex}.nav-links a{color:var(--color-text);font-size:1rem;font-weight:600;text-decoration:none;transition:color .2s}.nav-links a:hover,.nav-links a:focus-visible{color:var(--color-primary)}.btn-try-now,.btn-scan,.btn-classify{background:var(--color-primary);color:#fff;cursor:pointer;border:0;font-weight:600;transition:background-color .2s,color .2s,box-shadow .2s,transform .2s}.btn-try-now{white-space:nowrap;border-radius:999px;padding:12px 28px}.btn-try-now:hover,.btn-scan:hover,.btn-classify:hover:not(:disabled){color:var(--color-primary);box-shadow:inset 0 0 0 2px var(--color-primary);background:0 0}.nav-menu-toggle{background:var(--color-surface);cursor:pointer;border:0;border-radius:10px;width:44px;height:44px;padding:10px;display:none}.nav-menu-toggle span{background:var(--color-text);border-radius:2px;width:100%;height:2px;margin:5px 0;display:block}.hero-container{padding-top:clamp(48px,7vw,72px)}.hero-top{text-align:left;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:end;gap:clamp(48px,10vw,128px);margin-bottom:clamp(40px,6vw,64px);display:grid}.hero-title{align-self:start}.hero-title h1,.features-header h1,.categories-header h2,.upload-section-heading{color:var(--color-text);letter-spacing:-.035em;margin:0;font-size:clamp(2rem,4.3vw,3rem);font-weight:600;line-height:1.15}.hero-info p,.features-header p,.categories-header p{color:var(--color-text);margin:0;font-size:clamp(1rem,1.8vw,1.25rem);line-height:1.7}.hero-info p{max-width:450px;margin-bottom:30px}.brand-highlight,.brand-bold,.upload-section-heading-green{color:var(--color-primary);font-weight:700}.underline{color:var(--color-text);text-decoration:underline;-webkit-text-decoration-color:var(--color-primary);text-decoration-color:var(--color-primary);text-underline-offset:4px;font-style:italic;text-decoration-thickness:2px}.hero-buttons{align-items:stretch;gap:16px;display:flex}.hero-buttons>*{flex:1 1 0}.btn-scan,.btn-learn{border-radius:999px;min-height:48px;padding:12px 24px;font-size:1rem}.btn-learn{border:2px solid var(--color-muted);color:var(--color-muted);justify-content:center;align-items:center;font-weight:500;text-decoration:none;transition:color .2s,border-color .2s;display:inline-flex}.btn-learn:hover{color:var(--color-primary);border-color:var(--color-primary)}.hero-visual{position:relative}.video-wrapper{aspect-ratio:16/9;background:#111;border-radius:16px;width:100%;position:relative;overflow:hidden}.video-player{border:0;width:100%;height:100%;display:block}.floating-mascot{z-index:10;pointer-events:none;width:auto;height:clamp(220px,30vw,380px);position:absolute;bottom:-20px;right:clamp(-120px,-8vw,-56px)}.features-section,.categories-section,.upload-section{padding-top:var(--section-space)}.features-header,.categories-header{margin-bottom:clamp(36px,6vw,64px)}.features-header{text-align:left}.features-header h1,.categories-header h2{margin-bottom:24px}.features-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3vw,32px);display:grid}.feature-card{background:var(--color-surface);text-align:center;border-radius:16px;min-width:0;padding:clamp(24px,3vw,32px);transition:transform .2s}.feature-card:hover{transform:translateY(-6px)}.feature-icon-img{object-fit:contain;width:48px;height:48px}.feature-card h2{margin:20px 0 12px;font-size:clamp(1.25rem,2.2vw,1.5rem);font-weight:600}.feature-card p{color:var(--color-muted);margin:0;font-size:1rem;line-height:1.65}.categories-header{text-align:right}.categories-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(12px,2.2vw,24px);display:grid}.category-card{border:1px solid var(--color-border);background:var(--color-surface);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-width:0;padding:24px 10px;transition:transform .2s;display:flex}.category-card:hover{transform:translateY(-4px)}.category-icon-img{object-fit:contain;width:32px;height:32px}.category-name{overflow-wrap:anywhere;max-width:100%;color:var(--color-text);font-size:.95rem;font-weight:600}.input-type-dropdown{text-align:left;justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px;display:flex}.upload-section-heading{display:block}.upload-section-select,.input-type-dropdown select{border:1px solid var(--color-border);background:var(--color-surface);min-width:170px;min-height:48px;color:var(--color-text);border-radius:8px;flex:none;padding:10px 40px 10px 16px;font-size:1rem}.upload-box-container,.camera-container{margin-bottom:32px}.file-input-hidden{clip:rect(0,0,0,0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.upload-label{background:var(--color-surface);cursor:pointer;border:2px dashed #c1c1c1;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:clamp(260px,35vw,360px);padding:clamp(32px,6vw,50px) 24px;transition:border-color .2s,background-color .2s;display:flex}.upload-label:hover,.upload-label:focus-within{border-color:var(--color-primary);background:#eff8f4}.upload-icon{width:clamp(84px,13vw,128px);height:auto;margin-bottom:12px}.upload-text{color:var(--color-text);text-align:center;font-size:clamp(1rem,2vw,1.25rem);font-weight:500}.browse-file{color:var(--color-primary);font-weight:700}.supported-text{color:var(--color-muted);text-align:center;font-size:clamp(.8rem,1.6vw,1rem)}.url-import-container{text-align:left;width:100%;margin-bottom:16px}.url-input-wrapper{display:flex}.url-input{border:2px solid var(--color-border);background:var(--color-surface);width:100%;min-width:0;color:var(--color-text);border-radius:8px;padding:16px;font-size:1rem;font-weight:500}.url-input:focus,.upload-section-select:focus{border-color:var(--color-primary);outline:3px solid #0060411f}.camera-container{flex-direction:column;align-items:center;gap:16px;display:flex}.camera-container video,.upload-preview img{background:var(--color-surface);border-radius:16px;width:min(100%,720px);height:auto;margin-inline:auto;display:block}.upload-preview{margin:0 auto 24px}.preview-image{object-fit:contain;max-height:560px}.camera-btn-row{justify-content:center;gap:16px;width:100%;margin-top:12px;display:flex}.btn-open-camera{border:2px solid var(--color-muted);min-height:48px;color:var(--color-muted);cursor:pointer;background:0 0;border-radius:999px;padding:12px 28px;font-weight:500}.btn-capture{border:4px solid var(--color-primary);cursor:pointer;background:#fff;border-radius:50%;width:64px;height:64px;padding:0;position:relative}.btn-capture:after{content:"";background:var(--color-primary);border-radius:50%;position:absolute;inset:7px}.btn-classify{border-radius:8px;width:100%;min-height:54px;padding:14px 20px;font-size:1.125rem}.btn-classify:disabled{cursor:not-allowed;opacity:.55}.result-section{width:100%}.result-title{margin:56px 0 20px;font-size:1.5rem;font-weight:600}.result-tables-row{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:24px;display:grid}.result-table{table-layout:fixed;border:1px solid var(--color-border);border-collapse:separate;border-spacing:0;background:var(--color-surface);border-radius:16px;width:100%;min-width:0;overflow:hidden}.result-table th,.result-table td{border:1px solid var(--color-border);overflow-wrap:anywhere;width:50%;padding:15px;font-size:.95rem}.result-table th{text-align:left;font-weight:600}.result-table td{color:var(--color-text);text-align:center}.result-error{color:#b71c1c;overflow-wrap:anywhere;text-align:center;background:#fff0f0;border:2px solid #ffcdd2;border-radius:8px;margin-top:12px;padding:16px;font-weight:600}.footer-section{margin-top:var(--section-space);border-top:1px solid var(--color-border);text-align:left;background:#fff;padding-top:64px;overflow-x:hidden}.footer-container,.footer-bottom-content{width:min(100%,calc(var(--page-width) + (var(--page-gutter)*2)));padding-inline:var(--page-gutter);margin-inline:auto}.footer-top{justify-content:space-between;align-items:flex-start;gap:64px;margin-bottom:64px;display:flex}.footer-brand{max-width:360px}.footer-logo{align-items:center;margin-bottom:24px;display:flex}.footer-logo-img{width:auto;height:40px}.footer-desc{color:var(--color-muted);margin:0;font-size:1rem;line-height:1.65}.social-icons{flex-wrap:wrap;align-items:center;gap:16px;margin-top:36px;display:flex}.social-icons a{display:inline-flex}.social-icon{width:24px;height:24px;transition:transform .2s}.social-icon:hover{transform:translateY(-2px)}.footer-links-wrapper{flex-wrap:wrap;gap:clamp(40px,7vw,72px);display:flex}.footer-column h4{color:var(--color-text);margin:0 0 16px;font-size:1rem;font-weight:600}.footer-column ul{margin:0;padding:0;list-style:none}.footer-column li{margin-bottom:10px}.footer-column a,.footer-legal a{color:var(--color-muted);font-size:1rem;text-decoration:none}.footer-column a:hover,.footer-legal a:hover{color:var(--color-primary)}.footer-bottom{background:var(--color-surface);width:100%;margin-top:60px;padding-block:28px}.footer-bottom-content{color:var(--color-muted);justify-content:space-between;align-items:center;gap:24px;font-size:.875rem;display:flex}.footer-bottom-content p{margin:0}.footer-legal{flex-wrap:wrap;gap:24px;display:flex}.footer-legal a{font-size:.875rem}@media (max-width:900px){.hero-top{grid-template-columns:1fr;align-items:start;gap:28px}.hero-info p{max-width:680px}.hero-buttons{max-width:440px}.floating-mascot{height:clamp(170px,27vw,240px);right:-24px}.features-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.feature-card{padding:24px 18px}.categories-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.result-tables-row{grid-template-columns:1fr}.footer-top{gap:48px}}@media (max-width:768px){body{padding-top:66px}html{scroll-padding-top:82px}.nav-container{min-height:66px;padding-block:10px}.nav-logo img{height:34px}.nav-menu-toggle{display:block}.nav-menu{top:calc(100% + 1px);right:var(--page-gutter);left:var(--page-gutter);border:1px solid var(--color-border);background:#fff;border-radius:0 0 16px 16px;flex-direction:column;align-items:stretch;gap:20px;margin:0;padding:20px;display:none;position:absolute;box-shadow:0 16px 32px #00000014}.nav-menu-open{display:flex}.nav-links{flex-direction:column;align-items:stretch;gap:0}.nav-links a{padding:12px 4px;display:block}.btn-try-now{width:100%}.hero-container{padding-top:40px}.hero-buttons{width:100%;max-width:none}.video-wrapper{border-radius:12px}.floating-mascot{height:clamp(120px,30vw,180px);bottom:-16px;right:-12px}.features-grid{grid-template-columns:1fr}.feature-card{padding:28px 24px}.categories-header{text-align:left}.categories-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.input-type-dropdown{flex-direction:column;align-items:stretch;gap:20px}.upload-section-select,.input-type-dropdown select{width:100%}.footer-top{flex-direction:column;gap:48px}.footer-brand{max-width:520px}.footer-links-wrapper{justify-content:flex-start;width:100%}.footer-bottom-content{flex-direction:column;align-items:flex-start}}@media (max-width:480px){:root{--page-gutter:18px;--section-space:64px}.hero-buttons{flex-direction:column}.hero-buttons>*{flex-basis:auto;width:100%}.floating-mascot{display:none}.category-card{padding:20px 8px}.upload-label{min-height:250px;padding:28px 16px}.camera-btn-row{flex-direction:column;align-items:stretch}.btn-open-camera{width:100%}.btn-capture{align-self:center}.result-table th,.result-table td{padding:12px 10px;font-size:.82rem}.footer-links-wrapper{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;display:grid}.footer-legal{flex-direction:column;gap:12px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
