*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{overflow-x:hidden;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,Al-Awwal,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-size:16px;line-height:1.5;color:#111827;background-color:#f9fafb;overflow-x:hidden;-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:transparent}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(50px) scale(.95)}to{opacity:1;transform:translate(0) scale(1)}}.solar-calculator-container{width:100%;max-width:2200px;margin:0 auto;padding:20px;box-sizing:border-box}.solar-calculator-container.compact{max-width:1200px;padding:12px}.solar-calculator-container.dashboard{max-width:100%;width:100%;padding:0;margin:0}.solar-main-card{background:#fffffff2;border-radius:24px;padding:60px;box-shadow:0 25px 50px #0000001a;border:3px solid #3eb2b1;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;min-height:600px}.solar-main-card.compact{padding:40px;gap:40px;min-height:500px;border-width:2px}.solar-main-card.dashboard{padding:24px;gap:24px;min-height:calc(100vh - 200px);border-width:2px;border-radius:16px;width:100%;max-width:100%}.solar-form-side,.solar-results-side{width:100%;border:2px solid #3eb2b1;border-radius:16px;padding:24px;background:#f0fdfc80}.form-section{margin-bottom:24px;width:100%;display:flex;flex-direction:column;align-items:center}.form-section h3{font-size:16px;font-weight:700;color:#111827;margin:0 0 12px;display:flex;align-items:center;gap:8px}.button-group{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}.form-button{width:85%;padding:12px 16px;border:2px solid #e5e7eb;background:#fff;border-radius:10px;font-size:15px;font-weight:600;color:#374151;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .2s ease;box-sizing:border-box}.form-button:hover{border-color:#3eb2b1;background:#f0fdfc}.form-button.active{border-color:#3eb2b1;background:#f0fdfc;color:#0f766e}.form-input{width:85%;padding:14px 16px;border:2px solid #3eb2b1;border-radius:10px;font-size:16px;font-weight:600;color:#111827;background:#fff;text-align:center;box-sizing:border-box;outline:none;margin-bottom:6px}.form-input:focus{border-color:#0891b2;box-shadow:0 0 0 2px #3eb2b11a}.form-input.error{border-color:#ef4444;background:#fef2f2}.form-input.error:focus{border-color:#dc2626;box-shadow:0 0 0 2px #ef44441a}.form-select{width:85%;padding:14px 44px 14px 16px;border:2px solid #3eb2b1;border-radius:10px;font-size:16px;font-weight:600;color:#111827;background:#fff;cursor:pointer;text-align:center;box-sizing:border-box;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 16px center;background-repeat:no-repeat;background-size:16px}.form-hint{font-size:12px;color:#6b7280;text-align:center;margin:0;font-weight:500}.form-error{font-size:12px;color:#dc2626;text-align:center;margin:6px 0 0;font-weight:500;display:flex;align-items:center;justify-content:center;gap:6px}.calculate-btn{width:85%;padding:16px 20px;background:#3eb2b1;color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;margin:20px auto 0;transition:all .2s ease;box-sizing:border-box;box-shadow:0 6px 16px #3eb2b14d}.calculate-btn:hover:not(.disabled){background:#2d9d9c;transform:translateY(-2px);box-shadow:0 12px 32px #3eb2b166}.calculate-btn.disabled{background:#9ca3af;cursor:not-allowed;box-shadow:none;transform:none}.spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top:2px solid #ffffff;border-radius:50%;animation:spin 1s linear infinite}@media (max-width: 1200px){.solar-main-card{grid-template-columns:1fr;gap:40px;padding:40px}.solar-main-card.dashboard{gap:20px;padding:20px;min-height:calc(100vh - 150px)}}@media (max-width: 768px){.solar-calculator-container{padding:12px}.solar-calculator-container.dashboard{padding:0}.solar-main-card{padding:24px;gap:32px}.solar-main-card.dashboard{padding:16px;gap:16px;min-height:calc(100vh - 120px)}.form-section h3{font-size:13px}.form-button{padding:8px 10px;font-size:13px}.form-input{padding:8px 10px;font-size:14px}.form-select{padding:8px 10px;font-size:13px}.calculate-btn{padding:10px 14px;font-size:13px}}@media (max-width: 480px){.solar-calculator-container{padding:8px}.solar-calculator-container.dashboard{padding:0}.solar-main-card{padding:16px;gap:24px}.solar-main-card.dashboard{padding:12px;gap:12px;min-height:calc(100vh - 100px)}.form-section{margin-bottom:12px}.form-section h3{font-size:12px}.form-button{padding:6px 8px;font-size:12px;gap:6px}.form-input{padding:8px 10px;font-size:13px}.form-select{padding:8px 10px;font-size:12px}.calculate-btn{padding:10px 12px;font-size:13px}}.results-container{width:100%;animation:fadeInUp .6s ease-out}@media (max-width: 768px){.solar-results-grid{grid-template-columns:1fr!important;gap:16px!important}}#root{min-height:100vh;min-height:100dvh;isolation:isolate}img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}*{max-width:100%;box-sizing:border-box}.container,.solar-card-container,.main-layout,.solar-form-grid,.solar-results-grid,.solar-marketing-banner{max-width:100%!important;box-sizing:border-box!important}@media (max-width: 767px){.solar-form-section h3{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:var(--spacing-3);display:flex;align-items:center;gap:var(--spacing-2)}.solar-form-section h3 span{width:var(--spacing-5);height:var(--spacing-5);background:var(--color-primary-500);color:#fff;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.solar-form-section button{width:100%;padding:var(--spacing-4);border:2px solid var(--border-medium);border-radius:var(--radius-lg);background:var(--background-primary);color:var(--text-primary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-2)}.solar-form-section button[data-active=true]{border-color:var(--color-primary-500);background:var(--color-primary-50);color:var(--color-primary-700)}.solar-form-section input,.solar-form-section select{width:100%;padding:var(--spacing-4);border:2px solid var(--color-primary-500);border-radius:var(--radius-lg);background:var(--background-primary);color:var(--text-primary);font-size:16px;box-sizing:border-box}.solar-form-section input:focus,.solar-form-section select:focus{outline:none;border-color:var(--color-primary-600);box-shadow:0 0 0 3px var(--color-primary-100)}.solar-form-section p{font-size:var(--font-size-xs);color:var(--text-secondary);text-align:center;margin-top:var(--spacing-2)}}.calculate-button{width:100%;padding:var(--spacing-4) var(--spacing-6);background:var(--color-primary-500);color:#fff;border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);margin-top:var(--spacing-6);transition:all .2s ease;box-shadow:0 4px 14px #3eb2b14d}.calculate-button:hover:not(:disabled){background:var(--color-primary-600);transform:translateY(-1px);box-shadow:0 6px 20px #3eb2b166}.calculate-button:disabled{background:var(--neutral-400);cursor:not-allowed;box-shadow:none;transform:none}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}input[type=text],input[type=email],input[type=password],textarea{font:inherit;color:inherit}button.reset-button{cursor:pointer;border:none;background:transparent;padding:0;margin:0}:focus-visible{outline:2px solid #3eb2b1;outline-offset:2px}ul,ol{list-style:none}a{color:inherit;text-decoration:none}table{border-collapse:collapse;border-spacing:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.container{width:100%;max-width:1280px;margin:0 auto;padding:0 1rem}@media (min-width: 640px){.container{padding:0 2rem}}@media (min-width: 768px){.container{padding:0 3rem}}@media (min-width: 1024px){.container{padding:0 4rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-contrast: high){:root{--color-primary-500: #000000;--color-text-primary: #000000;--color-text-secondary: #000000;--color-background: #ffffff}}@media (prefers-color-scheme: dark){:root{color-scheme:dark}}@keyframes wave{0%{left:-100%}to{left:100%}}@keyframes waveBackground{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes waveReverse{0%{background-position:100% 50%}50%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.glass{background:linear-gradient(135deg,#ffffff40,#ffffff1a);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #1f26875e}.glass-hover{background:linear-gradient(135deg,#ffffff59,#ffffff26);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid rgba(255,255,255,.3);box-shadow:0 12px 40px #1f268780}.glass-card{background:linear-gradient(135deg,#ffffffe6,#f9fafbcc);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(229,231,235,.3);box-shadow:0 8px 32px #0000001a}.wave-bg{background:linear-gradient(45deg,#3eb2b1,#22d3db,#5cecea,#22d3db,#3eb2b1);background-size:400% 400%;animation:waveBackground 6s ease-in-out infinite}.wave-bg-reverse{background:linear-gradient(315deg,#3eb2b1,#22d3db,#5cecea,#22d3db,#3eb2b1);background-size:400% 400%;animation:waveReverse 8s ease-in-out infinite}.wave-text{background:linear-gradient(45deg,#3eb2b1,#22d3db,#5cecea,#22d3db,#3eb2b1);background-size:400% 400%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:waveBackground 4s ease-in-out infinite}.float-animation{animation:float 3s ease-in-out infinite}.shimmer{background:linear-gradient(90deg,#fff0,#fff3,#fff0);background-size:200% 100%;animation:shimmer 2s infinite}.glass-wave{position:relative;overflow:hidden}.glass-wave:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(62,178,177,.1),transparent);animation:shimmer 3s infinite}.glass-card:hover{background:linear-gradient(135deg,#f0fdfce6,#ccfdf9cc);transform:translateY(-2px);box-shadow:0 12px 40px #3eb2b126;border:1px solid rgba(62,178,177,.2)}@media print{*,*:before,*:after{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important;animation:none!important;transition:none!important}a,a:visited{text-decoration:underline}img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.main-layout{display:grid!important;grid-template-columns:1fr 1fr!important;gap:60px!important;align-items:start!important}@media (max-width: 1200px){.main-layout{grid-template-columns:1fr!important;gap:40px!important}}@media (max-width: 768px){.main-layout{gap:32px!important}}:root{--color-primary-50: #f0fdfc;--color-primary-100: #ccfdf9;--color-primary-200: #99f9f3;--color-primary-300: #5cecea;--color-primary-400: #22d3db;--color-primary-500: #3eb2b1;--color-primary-600: #0891b2;--color-primary-700: #0e7490;--color-primary-800: #155e75;--color-primary-900: #164e63;--color-primary-950: #083344;--neutral-50: #f9fafb;--neutral-100: #f3f4f6;--neutral-200: #e5e7eb;--neutral-300: #d1d5db;--neutral-400: #9ca3af;--neutral-500: #6b7280;--neutral-600: #4b5563;--neutral-700: #374151;--neutral-800: #1f2937;--neutral-900: #111827;--background-primary: #ffffff;--background-secondary: #f9fafb;--background-surface: rgba(255, 255, 255, .95);--text-primary: #111827;--text-secondary: #6b7280;--text-tertiary: #9ca3af;--border-light: #f3f4f6;--border-medium: #e5e7eb;--border-heavy: #d1d5db;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--spacing-1: .25rem;--spacing-1-5: .375rem;--spacing-2: .5rem;--spacing-2-5: .625rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-16: 4rem;--spacing-20: 5rem;--spacing-24: 6rem;--spacing-32: 8rem;--radius-sm: .125rem;--radius-base: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px}
