*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;padding:0;overflow-x:hidden;background-color:#fff;color:#111827;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--emerald-50: #ecfdf5;--emerald-100: #d1fae5;--emerald-500: #10b981;--emerald-600: #059669;--emerald-700: #047857;--red-50: #fef2f2;--red-500: #ef4444;--red-600: #dc2626;--blue-50: #eff6ff;--blue-500: #3b82f6;--blue-600: #2563eb;--yellow-50: #fefce8;--yellow-500: #eab308;--color-text-primary: var(--gray-900);--color-text-secondary: var(--gray-600);--color-text-muted: var(--gray-500);--color-border: var(--gray-200);--color-border-light: var(--gray-100);--color-bg-primary: #ffffff;--color-bg-secondary: var(--gray-50);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1)}@layer components{.input,input[type=text],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],input[type=number],textarea,select{width:100%;padding:.625rem .875rem;font-size:.875rem;line-height:1.5;color:var(--gray-900);background-color:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-md);transition:all var(--transition-base);outline:none}.input::placeholder,input::placeholder,textarea::placeholder{color:var(--gray-400)}.input:hover,input:hover,textarea:hover,select:hover{border-color:var(--gray-400)}.input:focus,input:focus,textarea:focus,select:focus{border-color:var(--emerald-500);outline:none;box-shadow:0 0 0 3px #10b9811a}.input:disabled,input:disabled,textarea:disabled,select:disabled{background-color:var(--gray-50);border-color:var(--gray-200);color:var(--gray-500);cursor:not-allowed}.input-with-icon{position:relative}.input-with-icon input{padding-left:2.5rem}.input-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--gray-400);pointer-events:none}.form-label{display:block;font-size:.875rem;font-weight:500;color:var(--gray-700);margin-bottom:.375rem}.input-error,input.error{border-color:var(--red-500)}.input-error:focus,input.error:focus{border-color:var(--red-500);box-shadow:0 0 0 3px #ef44441a}.error-message{margin-top:.375rem;font-size:.75rem;color:var(--red-600)}.input-success{border-color:var(--emerald-500)}.input-success:focus{box-shadow:0 0 0 3px #10b9811a}}@layer components{.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1rem;font-size:.875rem;font-weight:500;line-height:1.25rem;text-align:center;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);outline:none;text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--emerald-600);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){background-color:var(--emerald-700);box-shadow:var(--shadow-md)}.btn-primary:focus-visible{outline:2px solid var(--emerald-500);outline-offset:2px}.btn-secondary{background-color:#fff;color:var(--gray-700);border:1px solid var(--gray-300)}.btn-secondary:hover:not(:disabled){background-color:var(--gray-50);border-color:var(--gray-400)}.btn-ghost{background-color:transparent;color:var(--gray-700)}.btn-ghost:hover:not(:disabled){background-color:var(--gray-100)}.btn-gradient{background:linear-gradient(135deg,var(--emerald-600) 0%,var(--emerald-500) 100%);color:#fff;box-shadow:0 4px 14px #10b98140}.btn-gradient:hover:not(:disabled){background:linear-gradient(135deg,var(--emerald-700) 0%,var(--emerald-600) 100%);box-shadow:0 6px 20px #10b98159;transform:translateY(-1px)}.btn-sm{padding:.5rem .75rem;font-size:.75rem}.btn-md{padding:.625rem 1rem;font-size:.875rem}.btn-lg{padding:.75rem 1.5rem;font-size:1rem}.btn-xl{padding:1rem 2rem;font-size:1.125rem}.btn-icon{padding:.5rem;width:2.5rem;height:2.5rem}}@layer components{.product-card{transition:all var(--transition-base)}.product-card:hover{transform:translateY(-2px)}.product-card-image{position:relative;overflow:hidden;border-radius:var(--radius-lg);background-color:var(--gray-200);aspect-ratio:1 / 1}.product-card-image img{width:100%;height:100%;object-fit:cover;transition:opacity var(--transition-base)}.product-card:hover .product-card-image img{opacity:.75}.product-quick-view{position:absolute;inset:0;background-color:#11182700;transition:background-color var(--transition-base);display:flex;align-items:center;justify-content:center}.product-card:hover .product-quick-view{background-color:#11182799}.product-quick-view-btn{opacity:0;transform:translateY(.5rem);transition:all var(--transition-base)}.product-card:hover .product-quick-view-btn{opacity:1;transform:translateY(0)}.product-badge{position:absolute;top:.5rem;right:.5rem;z-index:10}.product-card-small .product-card-image{margin-bottom:.75rem}.product-card-small .product-name{font-size:.75rem;font-weight:500;line-height:1.25}.product-card-small .product-price{font-size:.75rem;font-weight:600}}@layer components{.card{background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base)}.card:hover{box-shadow:var(--shadow-md)}.card-interactive:hover{border-color:var(--gray-300);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-header{padding:1.25rem;border-bottom:1px solid var(--gray-100)}.card-body{padding:1.25rem}.card-footer{padding:1rem 1.25rem;border-top:1px solid var(--gray-100);background-color:var(--gray-50)}}@layer components{.navbar{background:#fff;border-bottom:1px solid var(--gray-200);box-shadow:0 1px 3px #0000000d;transition:box-shadow var(--transition-base)}.navbar-scrolled{box-shadow:var(--shadow-md)}.nav-link{color:var(--gray-600);font-weight:500;font-size:.875rem;padding:.5rem .75rem;border-radius:var(--radius-md);transition:all var(--transition-base)}.nav-link:hover{color:var(--gray-900);background-color:var(--gray-50)}.nav-link-active{color:var(--emerald-600);background-color:var(--emerald-50)}.dropdown-menu{position:absolute;min-width:12rem;background:#fff;border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:.5rem;z-index:50}.dropdown-item{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;font-size:.875rem;color:var(--gray-700);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.dropdown-item:hover{background-color:var(--gray-50);color:var(--gray-900)}.dropdown-divider{height:1px;background-color:var(--gray-100);margin:.5rem 0}}@layer components{.badge{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .625rem;font-size:.75rem;font-weight:500;border-radius:var(--radius-md);line-height:1.25rem}.badge-sm{padding:.125rem .5rem;font-size:.625rem}.badge-lg{padding:.375rem .75rem;font-size:.875rem}.badge-default{background-color:var(--gray-100);color:var(--gray-700)}.badge-primary,.badge-success{background-color:var(--emerald-100);color:var(--emerald-700)}.badge-error{background-color:var(--red-50);color:var(--red-700)}.badge-warning{background-color:var(--yellow-50);color:var(--gray-900)}.badge-info{background-color:var(--blue-50);color:var(--blue-700)}}a{text-decoration:none;color:inherit;transition:color var(--transition-base)}a:hover{text-decoration:none}.link{color:var(--emerald-600);font-weight:500}.link:hover{color:var(--emerald-700);text-decoration:underline}.dark-hero{background:linear-gradient(135deg,#111827,#1f2937);color:#fff;position:relative;overflow:hidden}.dark-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(16,185,129,.1) 0%,transparent 50%);pointer-events:none}@keyframes fadeInSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fade-in{animation:fadeIn .3s ease-out forwards}.animate-fade-up{animation:fadeInSlideUp .4s ease-out forwards}.animate-scale-in{animation:scaleIn .3s ease-out forwards}.animate-slide-in-right{animation:slideInRight .4s ease-out forwards}.animate-slide-in-left{animation:slideInLeft .4s ease-out forwards}.animate-float{animation:float 3s ease-in-out infinite}.animate-shimmer{animation:shimmer 2s infinite}.animate-spin{animation:spin 1s linear infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@layer utilities{.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.aspect-square{aspect-ratio:1 / 1}.aspect-video{aspect-ratio:16 / 9}.scrollbar-thin{scrollbar-width:thin}.scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}.scrollbar-thin::-webkit-scrollbar-track{background:var(--gray-100);border-radius:10px}.scrollbar-thin::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:10px}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.scrollbar-none{scrollbar-width:none}.scrollbar-none::-webkit-scrollbar{display:none}.glass{background:#ffffffb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.glass-dark{background:#111827b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.container{width:100%;max-width:1280px;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}@media(min-width:640px){.container{padding-left:1.5rem;padding-right:1.5rem}}@media(min-width:1024px){.container{padding-left:2rem;padding-right:2rem}}}.loader{display:grid;place-items:center;min-height:400px}.loader:after{content:"";width:48px;height:48px;border-radius:50%;border:4px solid var(--gray-200);border-top-color:var(--emerald-600);animation:spin .8s linear infinite}.skeleton{position:relative;overflow:hidden;background:var(--gray-100);border-radius:var(--radius-md)}.skeleton:after{content:"";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#ffffff80,#fff0);animation:shimmer 1.5s infinite}.skip-link{position:absolute;left:1rem;top:-3rem;background:var(--emerald-600);color:#fff;padding:.5rem 1rem;border-radius:var(--radius-md);z-index:100;font-weight:500;box-shadow:var(--shadow-lg);transition:top var(--transition-base)}.skip-link:focus{top:1rem;outline:2px solid var(--emerald-500);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}*:focus-visible{outline:2px solid var(--emerald-500);outline-offset:2px;border-radius:var(--radius-sm)}@media print{body{background:#fff}.no-print{display:none!important}a[href]:after{content:" (" attr(href) ")"}}