@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap";*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--background: 0 0% 100%;--foreground: 210 10% 8%;--card: 210 10% 98%;--card-foreground: 210 10% 8%;--popover: 0 0% 100%;--popover-foreground: 210 10% 8%;--primary: 142 65% 38%;--primary-foreground: 0 0% 100%;--secondary: 210 10% 96%;--secondary-foreground: 210 10% 8%;--muted: 210 10% 96%;--muted-foreground: 210 8% 46%;--accent: 210 10% 94%;--accent-foreground: 210 10% 8%;--destructive: 0 84.2% 60.2%;--destructive-foreground: 0 0% 98%;--border: 210 10% 88%;--input: 210 10% 88%;--ring: 142 65% 38%;--chart-1: 142 65% 38%;--chart-2: 210 8% 40%;--chart-3: 210 10% 92%;--chart-4: 43 74% 66%;--chart-5: 27 87% 67%;--radius: .5rem;--font-jakarta: "Plus Jakarta Sans", sans-serif;--anthracite: 210 10% 8%;--azure: 142 65% 38%;--smoke: 210 10% 96%;--sidebar-background: 0 0% 98%;--sidebar-foreground: 240 5.3% 26.1%;--sidebar-primary: 142 65% 38%;--sidebar-primary-foreground: 0 0% 100%;--sidebar-accent: 240 4.8% 95.9%;--sidebar-accent-foreground: 240 5.9% 10%;--sidebar-border: 220 13% 91%;--sidebar-ring: 142 65% 38%}.dark{--background: 210 10% 5%;--foreground: 0 0% 95%;--card: 210 10% 10%;--card-foreground: 0 0% 95%;--popover: 210 10% 7%;--popover-foreground: 0 0% 95%;--primary: 142 65% 42%;--primary-foreground: 0 0% 100%;--secondary: 210 10% 15%;--secondary-foreground: 0 0% 95%;--muted: 210 10% 15%;--muted-foreground: 210 5% 55%;--accent: 210 10% 17%;--accent-foreground: 0 0% 95%;--destructive: 0 62.8% 30.6%;--destructive-foreground: 0 0% 98%;--border: 210 10% 19%;--input: 210 10% 19%;--ring: 142 65% 42%;--chart-1: 142 65% 45%;--chart-2: 210 5% 60%;--chart-3: 210 10% 20%;--chart-4: 280 65% 60%;--chart-5: 340 75% 55%;--anthracite: 0 0% 95%;--azure: 142 65% 45%;--smoke: 210 10% 10%;--sidebar-background: 210 10% 5%;--sidebar-foreground: 240 4.8% 95.9%;--sidebar-primary: 142 65% 42%;--sidebar-primary-foreground: 0 0% 100%;--sidebar-accent: 210 10% 15%;--sidebar-accent-foreground: 240 4.8% 95.9%;--sidebar-border: 210 10% 19%;--sidebar-ring: 142 65% 42%}*{border-color:hsl(var(--border));outline-color:hsl(var(--ring) / .5)}body{background-color:hsl(var(--background));font-family:var(--font-jakarta);color:hsl(var(--foreground))}.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}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.invisible{visibility:hidden}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{top:0;right:0;bottom:0;left:0}.inset-x-0{left:0;right:0}.inset-x-4{left:1rem;right:1rem}.inset-y-0{top:0;bottom:0}.-bottom-12{bottom:-3rem}.-left-12{left:-3rem}.-right-12{right:-3rem}.-top-12{top:-3rem}.bottom-0{bottom:0}.bottom-6{bottom:1.5rem}.left-0{left:0}.left-1{left:.25rem}.left-1\/2{left:50%}.left-2{left:.5rem}.left-3{left:.75rem}.left-\[50\%\]{left:50%}.right-0{right:0}.right-1{right:.25rem}.right-2{right:.5rem}.right-3{right:.75rem}.right-4{right:1rem}.right-6{right:1.5rem}.top-0{top:0}.top-1\.5{top:.375rem}.top-1\/2{top:50%}.top-2{top:.5rem}.top-20{top:5rem}.top-3\.5{top:.875rem}.top-4{top:1rem}.top-\[1px\]{top:1px}.top-\[50\%\]{top:50%}.top-\[60\%\]{top:60%}.top-full{top:100%}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.z-\[100\]{z-index:100}.z-\[1\]{z-index:1}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-3\.5{margin-left:.875rem;margin-right:.875rem}.mx-auto{margin-left:auto;margin-right:auto}.my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-ml-4{margin-left:-1rem}.-mt-4{margin-top:-1rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-1{margin-left:.25rem}.ml-auto{margin-left:auto}.mr-2{margin-right:.5rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\.5{margin-top:.375rem}.mt-10{margin-top:2.5rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-24{margin-top:6rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-auto{margin-top:auto}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.aspect-square{aspect-ratio:1 / 1}.aspect-video{aspect-ratio:16 / 9}.size-4{width:1rem;height:1rem}.h-0\.5{height:.125rem}.h-1\.5{height:.375rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[1px\]{height:1px}.h-\[var\(--radix-navigation-menu-viewport-height\)\]{height:var(--radix-navigation-menu-viewport-height)}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.h-svh{height:100svh}.max-h-10{max-height:2.5rem}.max-h-96{max-height:24rem}.max-h-\[300px\]{max-height:300px}.max-h-screen{max-height:100vh}.min-h-0{min-height:0px}.min-h-\[60px\]{min-height:60px}.min-h-screen{min-height:100vh}.min-h-svh{min-height:100svh}.w-0{width:0px}.w-1{width:.25rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-16{width:4rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-24{width:6rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-3\/4{width:75%}.w-32{width:8rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7{width:1.75rem}.w-72{width:18rem}.w-8{width:2rem}.w-80{width:20rem}.w-9{width:2.25rem}.w-\[--sidebar-width\]{width:var(--sidebar-width)}.w-\[100px\]{width:100px}.w-\[1px\]{width:1px}.w-\[360px\]{width:360px}.w-auto{width:auto}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-px{width:1px}.min-w-0{min-width:0px}.min-w-10{min-width:2.5rem}.min-w-5{min-width:1.25rem}.min-w-8{min-width:2rem}.min-w-9{min-width:2.25rem}.min-w-\[12rem\]{min-width:12rem}.min-w-\[8rem\]{min-width:8rem}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-7xl{max-width:80rem}.max-w-\[--skeleton-width\]{max-width:var(--skeleton-width)}.max-w-\[80\%\]{max-width:80%}.max-w-\[calc\(100vw-2rem\)\]{max-width:calc(100vw - 2rem)}.max-w-full{max-width:100%}.max-w-lg{max-width:32rem}.max-w-max{max-width:-moz-max-content;max-width:max-content}.max-w-md{max-width:28rem}.max-w-none{max-width:none}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink-0,.shrink-0{flex-shrink:0}.grow{flex-grow:1}.grow-0{flex-grow:0}.basis-full{flex-basis:100%}.caption-bottom{caption-side:bottom}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-px{--tw-translate-x: -1px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-\[-50\%\]{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-px{--tw-translate-x: 1px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[-50\%\]{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate: 45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}.animate-bounce{animation:bounce 1s infinite}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-azure{0%,to{box-shadow:0 0 #25b15966}50%{box-shadow:0 0 0 12px #25b15900}}.animate-pulse-azure{animation:pulse-azure 2s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.snap-x{scroll-snap-type:x var(--tw-scroll-snap-strictness)}.snap-mandatory{--tw-scroll-snap-strictness: mandatory}.snap-start{scroll-snap-align:start}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-16{gap:4rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.75rem * var(--tw-space-x-reverse));margin-left:calc(.75rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.375rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem * var(--tw-space-y-reverse))}.space-y-10>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-2\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.625rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.625rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.space-y-8>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(2rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem * var(--tw-space-y-reverse))}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.whitespace-nowrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.rounded-2xl{border-radius:1rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[inherit\]{border-radius:inherit}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-sm{border-radius:calc(var(--radius) - 4px)}.rounded-xl{border-radius:.75rem}.rounded-b-2xl{border-bottom-right-radius:1rem;border-bottom-left-radius:1rem}.rounded-t-\[10px\]{border-top-left-radius:10px;border-top-right-radius:10px}.rounded-t-xl{border-top-left-radius:.75rem;border-top-right-radius:.75rem}.rounded-bl-sm{border-bottom-left-radius:calc(var(--radius) - 4px)}.rounded-br-sm{border-bottom-right-radius:calc(var(--radius) - 4px)}.rounded-tl-sm{border-top-left-radius:calc(var(--radius) - 4px)}.rounded-tr-2xl{border-top-right-radius:1rem}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-\[1\.5px\]{border-width:1.5px}.border-y{border-top-width:1px;border-bottom-width:1px}.border-b{border-bottom-width:1px}.border-b-0{border-bottom-width:0px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-\[--color-border\]{border-color:var(--color-border)}.border-background\/10{border-color:hsl(var(--background) / .1)}.border-border{border-color:hsl(var(--border))}.border-border\/50{border-color:hsl(var(--border) / .5)}.border-destructive{border-color:hsl(var(--destructive))}.border-destructive\/50{border-color:hsl(var(--destructive) / .5)}.border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-green-100{--tw-border-opacity: 1;border-color:rgb(220 252 231 / var(--tw-border-opacity, 1))}.border-input{border-color:hsl(var(--input))}.border-primary{border-color:hsl(var(--primary))}.border-primary-foreground\/30{border-color:hsl(var(--primary-foreground) / .3)}.border-primary\/10{border-color:hsl(var(--primary) / .1)}.border-primary\/20{border-color:hsl(var(--primary) / .2)}.border-primary\/50{border-color:hsl(var(--primary) / .5)}.border-sidebar-border{border-color:hsl(var(--sidebar-border))}.border-slate-100{--tw-border-opacity: 1;border-color:rgb(241 245 249 / var(--tw-border-opacity, 1))}.border-slate-200{--tw-border-opacity: 1;border-color:rgb(226 232 240 / var(--tw-border-opacity, 1))}.border-transparent{border-color:transparent}.border-white\/10{border-color:#ffffff1a}.border-white\/20{border-color:#fff3}.border-l-transparent{border-left-color:transparent}.border-t-primary{border-top-color:hsl(var(--primary))}.border-t-primary-foreground{border-top-color:hsl(var(--primary-foreground))}.border-t-slate-800{--tw-border-opacity: 1;border-top-color:rgb(30 41 59 / var(--tw-border-opacity, 1))}.border-t-transparent{border-top-color:transparent}.bg-\[--color-bg\]{background-color:var(--color-bg)}.bg-\[hsl\(var\(--primary\)\)\]{background-color:hsl(var(--primary))}.bg-accent{background-color:hsl(var(--accent))}.bg-amber-500\/10{background-color:#f59e0b1a}.bg-background{background-color:hsl(var(--background))}.bg-background\/10{background-color:hsl(var(--background) / .1)}.bg-black\/50{background-color:#00000080}.bg-black\/80{background-color:#000c}.bg-blue-500\/10{background-color:#3b82f61a}.bg-border{background-color:hsl(var(--border))}.bg-card{background-color:hsl(var(--card))}.bg-destructive{background-color:hsl(var(--destructive))}.bg-emerald-500\/10{background-color:#10b9811a}.bg-foreground{background-color:hsl(var(--foreground))}.bg-gray-400{--tw-bg-opacity: 1;background-color:rgb(156 163 175 / var(--tw-bg-opacity, 1))}.bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.bg-gray-800{--tw-bg-opacity: 1;background-color:rgb(31 41 55 / var(--tw-bg-opacity, 1))}.bg-gray-900{--tw-bg-opacity: 1;background-color:rgb(17 24 39 / var(--tw-bg-opacity, 1))}.bg-gray-900\/60{background-color:#11182799}.bg-gray-900\/80{background-color:#111827cc}.bg-gray-900\/85{background-color:#111827d9}.bg-gray-900\/95{background-color:#111827f2}.bg-muted{background-color:hsl(var(--muted))}.bg-muted\/50{background-color:hsl(var(--muted) / .5)}.bg-orange-100{--tw-bg-opacity: 1;background-color:rgb(255 237 213 / var(--tw-bg-opacity, 1))}.bg-orange-400{--tw-bg-opacity: 1;background-color:rgb(251 146 60 / var(--tw-bg-opacity, 1))}.bg-popover{background-color:hsl(var(--popover))}.bg-primary{background-color:hsl(var(--primary))}.bg-primary\/10{background-color:hsl(var(--primary) / .1)}.bg-primary\/20{background-color:hsl(var(--primary) / .2)}.bg-primary\/30{background-color:hsl(var(--primary) / .3)}.bg-primary\/5{background-color:hsl(var(--primary) / .05)}.bg-rose-500\/10{background-color:#f43f5e1a}.bg-secondary{background-color:hsl(var(--secondary))}.bg-sidebar{background-color:hsl(var(--sidebar-background))}.bg-sidebar-border{background-color:hsl(var(--sidebar-border))}.bg-sky-500\/10{background-color:#0ea5e91a}.bg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1))}.bg-slate-200{--tw-bg-opacity: 1;background-color:rgb(226 232 240 / var(--tw-bg-opacity, 1))}.bg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1))}.bg-smoke{background-color:hsl(var(--smoke))}.bg-transparent{background-color:transparent}.bg-violet-500\/10{background-color:#8b5cf61a}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-white\/10{background-color:#ffffff1a}.bg-white\/5{background-color:#ffffff0d}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-none{background-image:none}.from-background{--tw-gradient-from: hsl(var(--background)) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--background) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-gray-950{--tw-gradient-from: #030712 var(--tw-gradient-from-position);--tw-gradient-to: rgb(3 7 18 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-white{--tw-gradient-from: #fff var(--tw-gradient-from-position);--tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.via-gray-900\/95{--tw-gradient-to: rgb(17 24 39 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), rgb(17 24 39 / .95) var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-gray-900\/70{--tw-gradient-to: rgb(17 24 39 / .7) var(--tw-gradient-to-position)}.to-slate-50{--tw-gradient-to: #f8fafc var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.fill-current{fill:currentColor}.fill-primary{fill:hsl(var(--primary))}.fill-yellow-400{fill:#facc15}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0{padding:0}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.p-\[1px\]{padding:1px}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-20{padding-bottom:5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pl-10{padding-left:2.5rem}.pl-2{padding-left:.5rem}.pl-2\.5{padding-left:.625rem}.pl-4{padding-left:1rem}.pl-8{padding-left:2rem}.pr-2{padding-right:.5rem}.pr-2\.5{padding-right:.625rem}.pr-8{padding-right:2rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-28{padding-top:7rem}.pt-3{padding-top:.75rem}.pt-32{padding-top:8rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.text-left{text-align:left}.text-center{text-align:center}.align-middle{vertical-align:middle}.font-jakarta{font-family:var(--font-jakarta)}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-7xl{font-size:4.5rem;line-height:1}.text-\[0\.8rem\]{font-size:.8rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-light{font-weight:300}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.leading-\[1\.05\]{line-height:1.05}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-accent-foreground{color:hsl(var(--accent-foreground))}.text-amber-600{--tw-text-opacity: 1;color:rgb(217 119 6 / var(--tw-text-opacity, 1))}.text-background{color:hsl(var(--background))}.text-background\/30{color:hsl(var(--background) / .3)}.text-background\/40{color:hsl(var(--background) / .4)}.text-background\/50{color:hsl(var(--background) / .5)}.text-background\/60{color:hsl(var(--background) / .6)}.text-background\/80{color:hsl(var(--background) / .8)}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-card-foreground{color:hsl(var(--card-foreground))}.text-current{color:currentColor}.text-destructive{color:hsl(var(--destructive))}.text-destructive-foreground{color:hsl(var(--destructive-foreground))}.text-emerald-600{--tw-text-opacity: 1;color:rgb(5 150 105 / var(--tw-text-opacity, 1))}.text-foreground{color:hsl(var(--foreground))}.text-foreground\/50{color:hsl(var(--foreground) / .5)}.text-foreground\/70{color:hsl(var(--foreground) / .7)}.text-foreground\/80{color:hsl(var(--foreground) / .8)}.text-gray-200{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity, 1))}.text-gray-300{--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}.text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.text-green-100{--tw-text-opacity: 1;color:rgb(220 252 231 / var(--tw-text-opacity, 1))}.text-muted-foreground{color:hsl(var(--muted-foreground))}.text-muted-foreground\/30{color:hsl(var(--muted-foreground) / .3)}.text-muted-foreground\/60{color:hsl(var(--muted-foreground) / .6)}.text-orange-600{--tw-text-opacity: 1;color:rgb(234 88 12 / var(--tw-text-opacity, 1))}.text-popover-foreground{color:hsl(var(--popover-foreground))}.text-primary{color:hsl(var(--primary))}.text-primary-foreground{color:hsl(var(--primary-foreground))}.text-primary\/10{color:hsl(var(--primary) / .1)}.text-primary\/60{color:hsl(var(--primary) / .6)}.text-rose-600{--tw-text-opacity: 1;color:rgb(225 29 72 / var(--tw-text-opacity, 1))}.text-secondary-foreground{color:hsl(var(--secondary-foreground))}.text-sidebar-foreground{color:hsl(var(--sidebar-foreground))}.text-sidebar-foreground\/70{color:hsl(var(--sidebar-foreground) / .7)}.text-sky-600{--tw-text-opacity: 1;color:rgb(2 132 199 / var(--tw-text-opacity, 1))}.text-slate-300{--tw-text-opacity: 1;color:rgb(203 213 225 / var(--tw-text-opacity, 1))}.text-slate-600{--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1))}.text-slate-700{--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity, 1))}.text-slate-800{--tw-text-opacity: 1;color:rgb(30 41 59 / var(--tw-text-opacity, 1))}.text-slate-900{--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.text-violet-600{--tw-text-opacity: 1;color:rgb(124 58 237 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-yellow-400{--tw-text-opacity: 1;color:rgb(250 204 21 / var(--tw-text-opacity, 1))}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-90{opacity:.9}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\]{--tw-shadow: 0 0 0 1px hsl(var(--sidebar-border));--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-none{--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-black\/30{--tw-shadow-color: rgb(0 0 0 / .3);--tw-shadow: var(--tw-shadow-colored)}.shadow-primary\/20{--tw-shadow-color: hsl(var(--primary) / .2);--tw-shadow: var(--tw-shadow-colored)}.shadow-primary\/25{--tw-shadow-color: hsl(var(--primary) / .25);--tw-shadow: var(--tw-shadow-colored)}.shadow-primary\/30{--tw-shadow-color: hsl(var(--primary) / .3);--tw-shadow: var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ring-ring{--tw-ring-color: hsl(var(--ring))}.ring-sidebar-ring{--tw-ring-color: hsl(var(--sidebar-ring))}.ring-offset-background{--tw-ring-offset-color: hsl(var(--background))}.drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.grayscale{--tw-grayscale: grayscale(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-md{--tw-backdrop-blur: blur(12px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-xl{--tw-backdrop-blur: blur(24px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[left\,right\,width\]{transition-property:left,right,width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[margin\,opacity\]{transition-property:margin,opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[width\,height\,padding\]{transition-property:width,height,padding;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[width\]{transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-1000{transition-duration:1s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-linear{transition-timing-function:linear}@keyframes enter{0%{opacity:var(--tw-enter-opacity, 1);transform:translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0) scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity, 1);transform:translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0) scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0))}}.animate-in{animation-name:enter;animation-duration:.15s;--tw-enter-opacity: initial;--tw-enter-scale: initial;--tw-enter-rotate: initial;--tw-enter-translate-x: initial;--tw-enter-translate-y: initial}.fade-in-0{--tw-enter-opacity: 0}.zoom-in-95{--tw-enter-scale: .95}.duration-1000{animation-duration:1s}.duration-200{animation-duration:.2s}.duration-300{animation-duration:.3s}.duration-500{animation-duration:.5s}.duration-700{animation-duration:.7s}.ease-in-out{animation-timing-function:cubic-bezier(.4,0,.2,1)}.ease-linear{animation-timing-function:linear}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:hsl(var(--muted-foreground) / .3);border-radius:3px}html{scroll-behavior:smooth}.file\:border-0::file-selector-button{border-width:0px}.file\:bg-transparent::file-selector-button{background-color:transparent}.file\:text-sm::file-selector-button{font-size:.875rem;line-height:1.25rem}.file\:font-medium::file-selector-button{font-weight:500}.file\:text-foreground::file-selector-button{color:hsl(var(--foreground))}.placeholder\:text-muted-foreground::-moz-placeholder{color:hsl(var(--muted-foreground))}.placeholder\:text-muted-foreground::placeholder{color:hsl(var(--muted-foreground))}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:-inset-2:after{content:var(--tw-content);top:-.5rem;right:-.5rem;bottom:-.5rem;left:-.5rem}.after\:inset-y-0:after{content:var(--tw-content);top:0;bottom:0}.after\:left-1\/2:after{content:var(--tw-content);left:50%}.after\:w-1:after{content:var(--tw-content);width:.25rem}.after\:w-\[2px\]:after{content:var(--tw-content);width:2px}.after\:-translate-x-1\/2:after{content:var(--tw-content);--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.first\:rounded-l-md:first-child{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.first\:border-l:first-child{border-left-width:1px}.last\:rounded-r-md:last-child{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.focus-within\:relative:focus-within{position:relative}.focus-within\:z-20:focus-within{z-index:20}.hover\:scale-105:hover{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:gap-2\.5:hover{gap:.625rem}.hover\:gap-3:hover{gap:.75rem}.hover\:border-primary\/30:hover{border-color:hsl(var(--primary) / .3)}.hover\:border-slate-300:hover{--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity, 1))}.hover\:bg-accent:hover{background-color:hsl(var(--accent))}.hover\:bg-destructive\/80:hover{background-color:hsl(var(--destructive) / .8)}.hover\:bg-destructive\/90:hover{background-color:hsl(var(--destructive) / .9)}.hover\:bg-gray-100:hover{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-800\/60:hover{background-color:#1f293799}.hover\:bg-muted:hover{background-color:hsl(var(--muted))}.hover\:bg-muted\/50:hover{background-color:hsl(var(--muted) / .5)}.hover\:bg-primary:hover{background-color:hsl(var(--primary))}.hover\:bg-primary\/20:hover{background-color:hsl(var(--primary) / .2)}.hover\:bg-primary\/80:hover{background-color:hsl(var(--primary) / .8)}.hover\:bg-primary\/90:hover{background-color:hsl(var(--primary) / .9)}.hover\:bg-secondary:hover{background-color:hsl(var(--secondary))}.hover\:bg-secondary\/80:hover{background-color:hsl(var(--secondary) / .8)}.hover\:bg-sidebar-accent:hover{background-color:hsl(var(--sidebar-accent))}.hover\:bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1))}.hover\:bg-white\/10:hover{background-color:#ffffff1a}.hover\:text-accent-foreground:hover{color:hsl(var(--accent-foreground))}.hover\:text-background\/60:hover{color:hsl(var(--background) / .6)}.hover\:text-foreground:hover{color:hsl(var(--foreground))}.hover\:text-gray-200:hover{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity, 1))}.hover\:text-muted-foreground:hover{color:hsl(var(--muted-foreground))}.hover\:text-primary:hover{color:hsl(var(--primary))}.hover\:text-primary-foreground:hover{color:hsl(var(--primary-foreground))}.hover\:text-sidebar-accent-foreground:hover{color:hsl(var(--sidebar-accent-foreground))}.hover\:text-white:hover{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.hover\:underline:hover{text-decoration-line:underline}.hover\:no-underline:hover{text-decoration-line:none}.hover\:opacity-100:hover{opacity:1}.hover\:opacity-80:hover{opacity:.8}.hover\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-accent\)\)\]:hover{--tw-shadow: 0 0 0 1px hsl(var(--sidebar-accent));--tw-shadow-colored: 0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-lg:hover{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-md:hover{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-xl:hover{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.hover\:shadow-primary\/10:hover{--tw-shadow-color: hsl(var(--primary) / .1);--tw-shadow: var(--tw-shadow-colored)}.hover\:shadow-primary\/5:hover{--tw-shadow-color: hsl(var(--primary) / .05);--tw-shadow: var(--tw-shadow-colored)}.hover\:after\:bg-sidebar-border:hover:after{content:var(--tw-content);background-color:hsl(var(--sidebar-border))}.focus\:border-primary:focus{border-color:hsl(var(--primary))}.focus\:bg-accent:focus{background-color:hsl(var(--accent))}.focus\:bg-primary:focus{background-color:hsl(var(--primary))}.focus\:text-accent-foreground:focus{color:hsl(var(--accent-foreground))}.focus\:text-primary-foreground:focus{color:hsl(var(--primary-foreground))}.focus\:opacity-100:focus{opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-primary\/30:focus{--tw-ring-color: hsl(var(--primary) / .3)}.focus\:ring-ring:focus{--tw-ring-color: hsl(var(--ring))}.focus\:ring-slate-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(100 116 139 / var(--tw-ring-opacity, 1))}.focus\:ring-offset-2:focus{--tw-ring-offset-width: 2px}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus-visible\:ring-2:focus-visible{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color: hsl(var(--ring))}.focus-visible\:ring-sidebar-ring:focus-visible{--tw-ring-color: hsl(var(--sidebar-ring))}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width: 1px}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width: 2px}.focus-visible\:ring-offset-background:focus-visible{--tw-ring-offset-color: hsl(var(--background))}.active\:bg-sidebar-accent:active{background-color:hsl(var(--sidebar-accent))}.active\:text-sidebar-accent-foreground:active{color:hsl(var(--sidebar-accent-foreground))}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.group\/menu-item:focus-within .group-focus-within\/menu-item\:opacity-100{opacity:1}.group:hover .group-hover\:-translate-y-0\.5{--tw-translate-y: -.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-x-0\.5{--tw-translate-x: .125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-y-0\.5{--tw-translate-y: .125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:scale-105{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:border-primary\/20{border-color:hsl(var(--primary) / .2)}.group:hover .group-hover\:bg-primary\/20{background-color:hsl(var(--primary) / .2)}.group:hover .group-hover\:text-primary{color:hsl(var(--primary))}.group\/menu-item:hover .group-hover\/menu-item\:opacity-100,.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.group:hover .group-hover\:grayscale-0{--tw-grayscale: grayscale(0);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.group.destructive .group-\[\.destructive\]\:border-muted\/40{border-color:hsl(var(--muted) / .4)}.group.toaster .group-\[\.toaster\]\:border-border{border-color:hsl(var(--border))}.group.toast .group-\[\.toast\]\:bg-muted{background-color:hsl(var(--muted))}.group.toast .group-\[\.toast\]\:bg-primary{background-color:hsl(var(--primary))}.group.toaster .group-\[\.toaster\]\:bg-background{background-color:hsl(var(--background))}.group.destructive .group-\[\.destructive\]\:text-red-300{--tw-text-opacity: 1;color:rgb(252 165 165 / var(--tw-text-opacity, 1))}.group.toast .group-\[\.toast\]\:text-muted-foreground{color:hsl(var(--muted-foreground))}.group.toast .group-\[\.toast\]\:text-primary-foreground{color:hsl(var(--primary-foreground))}.group.toaster .group-\[\.toaster\]\:text-foreground{color:hsl(var(--foreground))}.group.toaster .group-\[\.toaster\]\:shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.group.destructive .group-\[\.destructive\]\:hover\:border-destructive\/30:hover{border-color:hsl(var(--destructive) / .3)}.group.destructive .group-\[\.destructive\]\:hover\:bg-destructive:hover{background-color:hsl(var(--destructive))}.group.destructive .group-\[\.destructive\]\:hover\:text-destructive-foreground:hover{color:hsl(var(--destructive-foreground))}.group.destructive .group-\[\.destructive\]\:hover\:text-red-50:hover{--tw-text-opacity: 1;color:rgb(254 242 242 / var(--tw-text-opacity, 1))}.group.destructive .group-\[\.destructive\]\:focus\:ring-destructive:focus{--tw-ring-color: hsl(var(--destructive))}.group.destructive .group-\[\.destructive\]\:focus\:ring-red-400:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(248 113 113 / var(--tw-ring-opacity, 1))}.group.destructive .group-\[\.destructive\]\:focus\:ring-offset-red-600:focus{--tw-ring-offset-color: #dc2626}.peer\/menu-button:hover~.peer-hover\/menu-button\:text-sidebar-accent-foreground{color:hsl(var(--sidebar-accent-foreground))}.peer:disabled~.peer-disabled\:cursor-not-allowed{cursor:not-allowed}.peer:disabled~.peer-disabled\:opacity-70{opacity:.7}.has-\[\[data-variant\=inset\]\]\:bg-sidebar:has([data-variant=inset]){background-color:hsl(var(--sidebar-background))}.has-\[\:disabled\]\:opacity-50:has(:disabled){opacity:.5}.group\/menu-item:has([data-sidebar=menu-action]) .group-has-\[\[data-sidebar\=menu-action\]\]\/menu-item\:pr-8{padding-right:2rem}.aria-disabled\:pointer-events-none[aria-disabled=true]{pointer-events:none}.aria-disabled\:opacity-50[aria-disabled=true]{opacity:.5}.aria-selected\:bg-accent[aria-selected=true]{background-color:hsl(var(--accent))}.aria-selected\:bg-accent\/50[aria-selected=true]{background-color:hsl(var(--accent) / .5)}.aria-selected\:text-accent-foreground[aria-selected=true]{color:hsl(var(--accent-foreground))}.aria-selected\:text-muted-foreground[aria-selected=true]{color:hsl(var(--muted-foreground))}.aria-selected\:opacity-100[aria-selected=true]{opacity:1}.data-\[disabled\=true\]\:pointer-events-none[data-disabled=true],.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction=vertical]{height:1px}.data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction=vertical]{width:100%}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x: -.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y: -.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x: 1rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked],.data-\[swipe\=cancel\]\:translate-x-0[data-swipe=cancel]{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[swipe\=end\]\:translate-x-\[var\(--radix-toast-swipe-end-x\)\][data-swipe=end]{--tw-translate-x: var(--radix-toast-swipe-end-x);transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[swipe\=move\]\:translate-x-\[var\(--radix-toast-swipe-move-x\)\][data-swipe=move]{--tw-translate-x: var(--radix-toast-swipe-move-x);transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up .2s ease-out}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down .2s ease-out}.data-\[panel-group-direction\=vertical\]\:flex-col[data-panel-group-direction=vertical]{flex-direction:column}.data-\[state\=open\]\:border-primary\/20[data-state=open]{border-color:hsl(var(--primary) / .2)}.data-\[active\=true\]\:bg-sidebar-accent[data-active=true]{background-color:hsl(var(--sidebar-accent))}.data-\[active\]\:bg-accent\/50[data-active]{background-color:hsl(var(--accent) / .5)}.data-\[selected\=true\]\:bg-accent[data-selected=true]{background-color:hsl(var(--accent))}.data-\[state\=active\]\:bg-background[data-state=active]{background-color:hsl(var(--background))}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:hsl(var(--primary))}.data-\[state\=on\]\:bg-accent[data-state=on],.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:hsl(var(--accent))}.data-\[state\=open\]\:bg-accent\/50[data-state=open]{background-color:hsl(var(--accent) / .5)}.data-\[state\=open\]\:bg-primary\/\[0\.02\][data-state=open]{background-color:hsl(var(--primary) / .02)}.data-\[state\=open\]\:bg-secondary[data-state=open]{background-color:hsl(var(--secondary))}.data-\[state\=selected\]\:bg-muted[data-state=selected]{background-color:hsl(var(--muted))}.data-\[state\=unchecked\]\:bg-input[data-state=unchecked]{background-color:hsl(var(--input))}.data-\[active\=true\]\:font-medium[data-active=true]{font-weight:500}.data-\[active\=true\]\:text-sidebar-accent-foreground[data-active=true]{color:hsl(var(--sidebar-accent-foreground))}.data-\[placeholder\]\:text-muted-foreground[data-placeholder]{color:hsl(var(--muted-foreground))}.data-\[selected\=true\]\:text-accent-foreground[data-selected=true]{color:hsl(var(--accent-foreground))}.data-\[state\=active\]\:text-foreground[data-state=active]{color:hsl(var(--foreground))}.data-\[state\=checked\]\:text-primary-foreground[data-state=checked]{color:hsl(var(--primary-foreground))}.data-\[state\=on\]\:text-accent-foreground[data-state=on],.data-\[state\=open\]\:text-accent-foreground[data-state=open]{color:hsl(var(--accent-foreground))}.data-\[state\=open\]\:text-muted-foreground[data-state=open]{color:hsl(var(--muted-foreground))}.data-\[disabled\=true\]\:opacity-50[data-disabled=true],.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[state\=open\]\:opacity-100[data-state=open]{opacity:1}.data-\[state\=active\]\:shadow[data-state=active]{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.data-\[swipe\=move\]\:transition-none[data-swipe=move]{transition-property:none}.data-\[state\=closed\]\:duration-300[data-state=closed]{transition-duration:.3s}.data-\[state\=open\]\:duration-500[data-state=open]{transition-duration:.5s}.data-\[motion\^\=from-\]\:animate-in[data-motion^=from-],.data-\[state\=open\]\:animate-in[data-state=open],.data-\[state\=visible\]\:animate-in[data-state=visible]{animation-name:enter;animation-duration:.15s;--tw-enter-opacity: initial;--tw-enter-scale: initial;--tw-enter-rotate: initial;--tw-enter-translate-x: initial;--tw-enter-translate-y: initial}.data-\[motion\^\=to-\]\:animate-out[data-motion^=to-],.data-\[state\=closed\]\:animate-out[data-state=closed],.data-\[state\=hidden\]\:animate-out[data-state=hidden],.data-\[swipe\=end\]\:animate-out[data-swipe=end]{animation-name:exit;animation-duration:.15s;--tw-exit-opacity: initial;--tw-exit-scale: initial;--tw-exit-rotate: initial;--tw-exit-translate-x: initial;--tw-exit-translate-y: initial}.data-\[motion\^\=from-\]\:fade-in[data-motion^=from-]{--tw-enter-opacity: 0}.data-\[motion\^\=to-\]\:fade-out[data-motion^=to-],.data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity: 0}.data-\[state\=closed\]\:fade-out-80[data-state=closed]{--tw-exit-opacity: .8}.data-\[state\=hidden\]\:fade-out[data-state=hidden]{--tw-exit-opacity: 0}.data-\[state\=open\]\:fade-in-0[data-state=open],.data-\[state\=visible\]\:fade-in[data-state=visible]{--tw-enter-opacity: 0}.data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale: .95}.data-\[state\=open\]\:zoom-in-90[data-state=open]{--tw-enter-scale: .9}.data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale: .95}.data-\[motion\=from-end\]\:slide-in-from-right-52[data-motion=from-end]{--tw-enter-translate-x: 13rem}.data-\[motion\=from-start\]\:slide-in-from-left-52[data-motion=from-start]{--tw-enter-translate-x: -13rem}.data-\[motion\=to-end\]\:slide-out-to-right-52[data-motion=to-end]{--tw-exit-translate-x: 13rem}.data-\[motion\=to-start\]\:slide-out-to-left-52[data-motion=to-start]{--tw-exit-translate-x: -13rem}.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y: -.5rem}.data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x: .5rem}.data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x: -.5rem}.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y: .5rem}.data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed]{--tw-exit-translate-y: 100%}.data-\[state\=closed\]\:slide-out-to-left[data-state=closed]{--tw-exit-translate-x: -100%}.data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state=closed]{--tw-exit-translate-x: -50%}.data-\[state\=closed\]\:slide-out-to-right[data-state=closed],.data-\[state\=closed\]\:slide-out-to-right-full[data-state=closed]{--tw-exit-translate-x: 100%}.data-\[state\=closed\]\:slide-out-to-top[data-state=closed]{--tw-exit-translate-y: -100%}.data-\[state\=closed\]\:slide-out-to-top-\[48\%\][data-state=closed]{--tw-exit-translate-y: -48%}.data-\[state\=open\]\:slide-in-from-bottom[data-state=open]{--tw-enter-translate-y: 100%}.data-\[state\=open\]\:slide-in-from-left[data-state=open]{--tw-enter-translate-x: -100%}.data-\[state\=open\]\:slide-in-from-left-1\/2[data-state=open]{--tw-enter-translate-x: -50%}.data-\[state\=open\]\:slide-in-from-right[data-state=open]{--tw-enter-translate-x: 100%}.data-\[state\=open\]\:slide-in-from-top[data-state=open]{--tw-enter-translate-y: -100%}.data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state=open]{--tw-enter-translate-y: -48%}.data-\[state\=open\]\:slide-in-from-top-full[data-state=open]{--tw-enter-translate-y: -100%}.data-\[state\=closed\]\:duration-300[data-state=closed]{animation-duration:.3s}.data-\[state\=open\]\:duration-500[data-state=open]{animation-duration:.5s}.data-\[panel-group-direction\=vertical\]\:after\:left-0[data-panel-group-direction=vertical]:after{content:var(--tw-content);left:0}.data-\[panel-group-direction\=vertical\]\:after\:h-1[data-panel-group-direction=vertical]:after{content:var(--tw-content);height:.25rem}.data-\[panel-group-direction\=vertical\]\:after\:w-full[data-panel-group-direction=vertical]:after{content:var(--tw-content);width:100%}.data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2[data-panel-group-direction=vertical]:after{content:var(--tw-content);--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[panel-group-direction\=vertical\]\:after\:translate-x-0[data-panel-group-direction=vertical]:after{content:var(--tw-content);--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.data-\[state\=open\]\:hover\:bg-sidebar-accent:hover[data-state=open]{background-color:hsl(var(--sidebar-accent))}.data-\[state\=open\]\:hover\:text-sidebar-accent-foreground:hover[data-state=open]{color:hsl(var(--sidebar-accent-foreground))}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\]{left:calc(var(--sidebar-width) * -1)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\]{right:calc(var(--sidebar-width) * -1)}.group[data-side=left] .group-data-\[side\=left\]\:-right-4{right:-1rem}.group[data-side=right] .group-data-\[side\=right\]\:left-0{left:0}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:-mt-8{margin-top:-2rem}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:hidden{display:none}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!size-8{width:2rem!important;height:2rem!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[--sidebar-width-icon\]{width:var(--sidebar-width-icon)}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)\)\]{width:calc(var(--sidebar-width-icon) + 1rem)}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)_\+2px\)\]{width:calc(var(--sidebar-width-icon) + 1rem + 2px)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:w-0{width:0px}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group[data-side=right] .group-data-\[side\=right\]\:rotate-180,.group[data-state=open] .group-data-\[state\=open\]\:rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:overflow-hidden{overflow:hidden}.group[data-variant=floating] .group-data-\[variant\=floating\]\:rounded-lg{border-radius:var(--radius)}.group[data-variant=floating] .group-data-\[variant\=floating\]\:border{border-width:1px}.group[data-side=left] .group-data-\[side\=left\]\:border-r{border-right-width:1px}.group[data-side=right] .group-data-\[side\=right\]\:border-l{border-left-width:1px}.group[data-variant=floating] .group-data-\[variant\=floating\]\:border-sidebar-border{border-color:hsl(var(--sidebar-border))}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!p-0{padding:0!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:\!p-2{padding:.5rem!important}.group[data-collapsible=icon] .group-data-\[collapsible\=icon\]\:opacity-0{opacity:0}.group[data-variant=floating] .group-data-\[variant\=floating\]\:shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:after\:left-full:after{content:var(--tw-content);left:100%}.group[data-collapsible=offcanvas] .group-data-\[collapsible\=offcanvas\]\:hover\:bg-sidebar:hover{background-color:hsl(var(--sidebar-background))}.peer\/menu-button[data-size=default]~.peer-data-\[size\=default\]\/menu-button\:top-1\.5{top:.375rem}.peer\/menu-button[data-size=lg]~.peer-data-\[size\=lg\]\/menu-button\:top-2\.5{top:.625rem}.peer\/menu-button[data-size=sm]~.peer-data-\[size\=sm\]\/menu-button\:top-1{top:.25rem}.peer[data-variant=inset]~.peer-data-\[variant\=inset\]\:min-h-\[calc\(100svh-theme\(spacing\.4\)\)\]{min-height:calc(100svh - 1rem)}.peer\/menu-button[data-active=true]~.peer-data-\[active\=true\]\/menu-button\:text-sidebar-accent-foreground{color:hsl(var(--sidebar-accent-foreground))}.dark\:border-destructive:is(.dark *){border-color:hsl(var(--destructive))}@media(min-width:640px){.sm\:bottom-0{bottom:0}.sm\:right-0{right:0}.sm\:top-auto{top:auto}.sm\:mt-0{margin-top:0}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:hidden{display:none}.sm\:max-w-sm{max-width:24rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:flex-col{flex-direction:column}.sm\:justify-end{justify-content:flex-end}.sm\:gap-2\.5{gap:.625rem}.sm\:space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.sm\:space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.sm\:space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.sm\:rounded-lg{border-radius:var(--radius)}.sm\:text-left{text-align:left}.data-\[state\=open\]\:sm\:slide-in-from-bottom-full[data-state=open]{--tw-enter-translate-y: 100%}}@media(min-width:768px){.md\:absolute{position:absolute}.md\:col-span-2{grid-column:span 2 / span 2}.md\:col-span-3{grid-column:span 3 / span 3}.md\:block{display:block}.md\:flex{display:flex}.md\:inline-flex{display:inline-flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:w-1\/3{width:33.333333%}.md\:w-2\/3{width:66.666667%}.md\:w-\[var\(--radix-navigation-menu-viewport-width\)\]{width:var(--radix-navigation-menu-viewport-width)}.md\:w-auto{width:auto}.md\:max-w-\[420px\]{max-width:420px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:items-center{align-items:center}.md\:p-10{padding:2.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:py-24{padding-top:6rem;padding-bottom:6rem}.md\:py-28{padding-top:7rem;padding-bottom:7rem}.md\:py-32{padding-top:8rem;padding-bottom:8rem}.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}.md\:text-5xl{font-size:3rem;line-height:1}.md\:text-6xl{font-size:3.75rem;line-height:1}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-xl{font-size:1.25rem;line-height:1.75rem}.md\:opacity-0{opacity:0}.after\:md\:hidden:after{content:var(--tw-content);display:none}.peer[data-variant=inset]~.md\:peer-data-\[variant\=inset\]\:m-2{margin:.5rem}.peer[data-state=collapsed][data-variant=inset]~.md\:peer-data-\[state\=collapsed\]\:peer-data-\[variant\=inset\]\:ml-2{margin-left:.5rem}.peer[data-variant=inset]~.md\:peer-data-\[variant\=inset\]\:ml-0{margin-left:0}.peer[data-variant=inset]~.md\:peer-data-\[variant\=inset\]\:rounded-xl{border-radius:.75rem}.peer[data-variant=inset]~.md\:peer-data-\[variant\=inset\]\:shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}}@media(min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:text-7xl{font-size:4.5rem;line-height:1}}.\[\&\:has\(\>\.day-range-end\)\]\:rounded-r-md:has(>.day-range-end){border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\>\.day-range-start\)\]\:rounded-l-md:has(>.day-range-start){border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\[aria-selected\]\)\]\:rounded-md:has([aria-selected]){border-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\[aria-selected\]\)\]\:bg-accent:has([aria-selected]){background-color:hsl(var(--accent))}.first\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-l-md:has([aria-selected]):first-child{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.last\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-r-md:has([aria-selected]):last-child{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\[aria-selected\]\.day-outside\)\]\:bg-accent\/50:has([aria-selected].day-outside){background-color:hsl(var(--accent) / .5)}.\[\&\:has\(\[aria-selected\]\.day-range-end\)\]\:rounded-r-md:has([aria-selected].day-range-end){border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}.\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\]>[role=checkbox]{--tw-translate-y: 2px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&\>button\]\:hidden>button{display:none}.\[\&\>span\:last-child\]\:truncate>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.\[\&\>span\]\:line-clamp-1>span{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.\[\&\>svg\+div\]\:translate-y-\[-3px\]>svg+div{--tw-translate-y: -3px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&\>svg\]\:absolute>svg{position:absolute}.\[\&\>svg\]\:left-4>svg{left:1rem}.\[\&\>svg\]\:top-4>svg{top:1rem}.\[\&\>svg\]\:size-4>svg{width:1rem;height:1rem}.\[\&\>svg\]\:h-2\.5>svg{height:.625rem}.\[\&\>svg\]\:h-3>svg{height:.75rem}.\[\&\>svg\]\:h-3\.5>svg{height:.875rem}.\[\&\>svg\]\:w-2\.5>svg{width:.625rem}.\[\&\>svg\]\:w-3>svg{width:.75rem}.\[\&\>svg\]\:w-3\.5>svg{width:.875rem}.\[\&\>svg\]\:shrink-0>svg{flex-shrink:0}.\[\&\>svg\]\:text-destructive>svg{color:hsl(var(--destructive))}.\[\&\>svg\]\:text-foreground>svg{color:hsl(var(--foreground))}.\[\&\>svg\]\:text-muted-foreground>svg{color:hsl(var(--muted-foreground))}.\[\&\>svg\]\:text-sidebar-accent-foreground>svg{color:hsl(var(--sidebar-accent-foreground))}.\[\&\>svg\~\*\]\:pl-7>svg~*{padding-left:1.75rem}.\[\&\>tr\]\:last\:border-b-0:last-child>tr{border-bottom-width:0px}.\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90[data-panel-group-direction=vertical]>div{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text{fill:hsl(var(--muted-foreground))}.\[\&_\.recharts-cartesian-grid_line\[stroke\=\'\#ccc\'\]\]\:stroke-border\/50 .recharts-cartesian-grid line[stroke="#ccc"]{stroke:hsl(var(--border) / .5)}.\[\&_\.recharts-curve\.recharts-tooltip-cursor\]\:stroke-border .recharts-curve.recharts-tooltip-cursor{stroke:hsl(var(--border))}.\[\&_\.recharts-dot\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-dot[stroke="#fff"]{stroke:transparent}.\[\&_\.recharts-layer\]\:outline-none .recharts-layer{outline:2px solid transparent;outline-offset:2px}.\[\&_\.recharts-polar-grid_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-polar-grid [stroke="#ccc"]{stroke:hsl(var(--border))}.\[\&_\.recharts-radial-bar-background-sector\]\:fill-muted .recharts-radial-bar-background-sector,.\[\&_\.recharts-rectangle\.recharts-tooltip-cursor\]\:fill-muted .recharts-rectangle.recharts-tooltip-cursor{fill:hsl(var(--muted))}.\[\&_\.recharts-reference-line_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-reference-line [stroke="#ccc"]{stroke:hsl(var(--border))}.\[\&_\.recharts-sector\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-sector[stroke="#fff"]{stroke:transparent}.\[\&_\.recharts-sector\]\:outline-none .recharts-sector,.\[\&_\.recharts-surface\]\:outline-none .recharts-surface{outline:2px solid transparent;outline-offset:2px}.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading]{padding-left:.5rem;padding-right:.5rem}.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading]{padding-top:.375rem;padding-bottom:.375rem}.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading]{font-size:.75rem;line-height:1rem}.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading]{font-weight:500}.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading]{color:hsl(var(--muted-foreground))}.\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden])~[cmdk-group]{padding-top:0}.\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group]{padding-left:.5rem;padding-right:.5rem}.\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg{height:1.25rem}.\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg{width:1.25rem}.\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input]{height:3rem}.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item]{padding-left:.5rem;padding-right:.5rem}.\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item]{padding-top:.75rem;padding-bottom:.75rem}.\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg{height:1.25rem}.\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg{width:1.25rem}.\[\&_p\]\:leading-relaxed p{line-height:1.625}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-4 svg{width:1rem;height:1rem}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-width:0px}.\[\&_tr\]\:border-b tr{border-bottom-width:1px}[data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2{right:-.5rem}[data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize{cursor:e-resize}[data-side=left] .\[\[data-side\=left\]_\&\]\:cursor-w-resize{cursor:w-resize}[data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2{left:-.5rem}[data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize{cursor:w-resize}[data-side=right] .\[\[data-side\=right\]_\&\]\:cursor-e-resize{cursor:e-resize}


/* ============================================================
   ↑ Vite bundle (index-Cv4qxr7-.css) — Tailwind + Base44 components
   Merged 2026-06-05. See cs_validation.md for details.
   ============================================================ */

/* ============================================================
   app.css — poistito.online
   Custom / override styles for the PHP template layer.
   Add project-specific rules here; do not edit the Vite bundle.
   ============================================================ */


/* ------------------------------------------------------------
   0. Global — scrollbar gutter fix
   ------------------------------------------------------------ */

/*
 * Always reserve space for the scrollbar so the layout width
 * stays identical on both scrollable and non-scrollable pages.
 * Without this the centered nav shifts ~15 px between pages.
 */
html {
    scrollbar-gutter: stable;
}


/* ------------------------------------------------------------
   0b. Design tokens — Sprint #3 design alignment
   Single source of truth for radii, borders, surfaces, shadows
   and spacing. Reference these variables in all custom classes
   instead of hardcoding raw values.
   ------------------------------------------------------------ */

:root {
    /* ── Border radius ─────────────────────────────────────── */
    --radius-sm: 0.5rem;     /* rounded-lg  — pagination, chips   */
    --radius-md: 0.75rem;    /* rounded-xl  — buttons, icons, inputs */
    --radius-lg: 1rem;       /* rounded-2xl — content cards        */
    --radius-xl: 1.5rem;     /* rounded-3xl — featured/hero panels */

    /* ── Border colours ────────────────────────────────────── */
    --border-card:  rgb(229, 231, 235);   /* gray-200 — card outlines  */
    --border-input: rgb(209, 213, 219);   /* gray-300 — form inputs    */

    /* ── Surface backgrounds ───────────────────────────────── */
    --bg-card:    rgb(249, 250, 251);     /* gray-50  — section cards  */
    --bg-surface: #ffffff;               /* white    — form/panel fill */

    /* ── Elevation — box shadows ───────────────────────────── */
    --shadow-card:  0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
    --shadow-hover: 0 4px 16px rgba(0,0,0,.08);
    --shadow-focus: 0 0 0 3px hsl(var(--primary) / .12);

    /* ── Spacing aliases (Tailwind rem steps) ──────────────── */
    --space-3: 0.75rem;    /* 12 px  gap-3   */
    --space-4: 1rem;       /* 16 px  p-4     */
    --space-5: 1.25rem;    /* 20 px  mt-5    */
    --space-6: 1.5rem;     /* 24 px  p-6     */
    --space-8: 2rem;       /* 32 px  p-8     */
    --space-12: 3rem;      /* 48 px  mb-12   */
}


/* ------------------------------------------------------------
   1. Layout utilities
   ------------------------------------------------------------ */

/*
 * Main content column — grows to fill vertical space, same max-width as the navbar.
 * Navbar: max-w-5xl (64 rem) centered inside px-4 outer header padding.
 */
.flex-1 {
    flex:          1 1 0%;
    width:         100%;
    /*max-width:     64rem;   /* max-w-5xl — matches navbar */
    margin-left:   auto;
    margin-right:  auto;
    padding-left:  1rem;    /* px-4 — matches outer header padding */
    padding-right: 1rem;
}

/*
 * Full-width main content column — same as flex-1 but no width constraint.
 * Used on the homepage (index.php) where hero and sections span the full viewport.
 */
.flex-landing {
    flex: 1 1 0%;
}

/*
 * Standard page content container.
 * Replaces: max-w-7xl mx-auto px-6 md:px-8
 * Used as the inner wrapper of every full-width section.
 */
.page-container {
    max-width:     80rem;    /* max-w-7xl  — 1280 px */
    margin-left:   auto;     /* mx-auto */
    margin-right:  auto;
    padding-left:  1.5rem;   /* px-6 */
    padding-right: 1.5rem;
}

@media (min-width: 768px) { /* md: */
    .page-container {
        padding-left:  2rem; /* md:px-8 */
        padding-right: 2rem;
    }
}

/* Hero section — relative min-h-screen flex items-center overflow-hidden */
.hero-section {
    position:    relative;
    min-height:  100vh;
    display:     flex;
    align-items: center;
    overflow:    hidden;
}

/*
 * Subtitle paragraph used under page headings.
 * Replaces: mt-4 text-muted-foreground text-lg leading-relaxed max-w-xl
 *   mt-4                → margin-top 1 rem
 *   text-muted-foreground → color hsl(var(--muted-foreground))
 *   text-lg             → font-size 1.125 rem
 *   leading-relaxed     → line-height 1.625  (overrides text-lg default 1.75 rem)
 *   max-w-xl            → max-width 36 rem
 */
.page-subtitle {
    margin-top:  1rem;                        /* mt-4 */
    color:       hsl(var(--muted-foreground)); /* text-muted-foreground */
    font-size:   1.125rem;                    /* text-lg */
    line-height: 1.625;                       /* leading-relaxed */
    max-width:   36rem;                       /* max-w-xl */
}

/*
 * Small muted body text — callout boxes and descriptive copy inside product cards.
 * Replaces: text-sm text-muted-foreground leading-relaxed  (12 occurrences in produkty.php)
 *   text-sm             → font-size 0.875 rem
 *   text-muted-foreground → color hsl(var(--muted-foreground))
 *   leading-relaxed     → line-height 1.625  (overrides text-sm default 1.25 rem)
 */
.body-sm {
    font-size:   0.875rem;                    /* text-sm */
    color:       hsl(var(--muted-foreground)); /* text-muted-foreground */
    line-height: 1.625;                       /* leading-relaxed */
}

/*
 * Page header section — white background, top padding clears the fixed nav, bottom spacing.
 * Replaces: bg-white pt-28 pb-12
 * Animates in from below with a small spring bounce on page load.
 */
.page-header-section {
    background-color: #ffffff;                                          /* bg-white */
    padding-top:      8rem;                                             /* pt-28 — 28 × 0.25 rem */
    padding-bottom:   10px;                                             /* pb-12 — 12 × 0.25 rem */
    animation: page-header-bounce-in 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes page-header-bounce-in {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0);    }
}

@media (prefers-reduced-motion: reduce) {
    .page-header-section { animation: none; }
}

/*
 * TOP section of each page, white background.
 * Padding matches the other content sections (product-section, blog-section).
 */
.top-section {
    background-color: var(--bg-surface);
    padding-top:      2rem;    /* 32 px — breathing room on mobile  */
    padding-bottom:   4rem;    /* 64 px */
}

@media (min-width: 768px) {
    .top-section {
        padding-top:    3rem;  /* 48 px — matches product-section   */
        padding-bottom: 5rem;  /* 80 px — matches product-section   */
    }
}


/* ------------------------------------------------------------
   2. Mobile navigation menu
   ------------------------------------------------------------ */

/* Hidden by default; toggled open via JS (.open class) */
.nav-mobile {
    display:          none;
    flex-direction:   column;
    gap:              0.25rem;
    width:            100%;
    max-width:        56rem;
    background:       rgba(3, 7, 18, 0.97);
    backdrop-filter:  blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border:           1px solid rgba(255, 255, 255, 0.1);
    border-radius:    1rem;
    padding:          0.75rem;
    margin-top:       0.5rem;
    box-shadow:       0 8px 32px rgba(0, 0, 0, 0.4);
}

.nav-mobile.open {
    display: flex;
}

/* Hide on desktop — never show the mobile panel above md breakpoint */
@media (min-width: 768px) {
    .nav-mobile           { display: none !important; }
    #nav-toggle           { display: none !important; }
}

/* Link styles inside mobile menu */
.nav-mobile a {
    padding:     0.75rem 1rem;
    font-size:   0.875rem;
    font-weight: 500;
    color:       rgb(209, 213, 219);
    border-radius: 0.5rem;
    transition:  color 0.15s, background-color 0.15s;
    text-decoration: none;
    display:     block;
}

.nav-mobile a:hover {
    color:       white;
    background:  rgba(255, 255, 255, 0.08);
}

/* Active link in mobile menu */
.nav-mobile a.text-primary {
    color:       hsl(var(--primary));
    background:  hsl(var(--primary) / 0.1);
}

/* CTA button at bottom of mobile menu */
.nav-mobile-cta {
    margin-top:    0.5rem !important;
    padding:       0.75rem 1.25rem !important;
    background:    hsl(var(--primary)) !important;
    color:         hsl(var(--primary-foreground)) !important;
    font-weight:   600 !important;
    border-radius: 0.75rem !important;
    text-align:    center;
    display:       block;
    text-decoration: none;
    transition:    opacity 0.15s;
}

.nav-mobile-cta:hover {
    opacity: 0.9;
}


/* ------------------------------------------------------------
   3. Stat card — glass tile used in hero grid
   ------------------------------------------------------------ */

/* Replaces: p-6 rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 */
.stat-card {
    padding:         var(--space-6);              /* p-6  — 1.5 rem */
    border-radius:   var(--radius-lg);            /* rounded-2xl    */
    background:      rgba(255,255,255,.05);        /* bg-white/5     */
    backdrop-filter: blur(12px);                   /* backdrop-blur-md */
    -webkit-backdrop-filter: blur(12px);
    border:          1px solid rgba(255,255,255,.1);
}


/* ------------------------------------------------------------
   4. Page content wrapper
   ------------------------------------------------------------ */

/* Replaces: relative z-10 w-full max-w-7xl mx-auto px-6 md:px-8 pb-20 */
.hero-content {
    position:      relative;
    z-index:       10;
    width:         100%;
    max-width:     80rem;       /* max-w-7xl */
    margin-left:   auto;
    margin-right:  auto;
    padding-top:   100px;
    padding-bottom: 5rem;       /* pb-20 */
    padding-left:  1.5rem;      /* px-6 */
    padding-right: 1.5rem;
}

@media (min-width: 768px) {    /* md: breakpoint */
    .hero-content {
        padding-left:  2rem;    /* md:px-8 */
        padding-right: 2rem;
    }
}


/* ------------------------------------------------------------
   5. Cookie consent banner
   ------------------------------------------------------------ */

/*
 * Fixed bar at the bottom of the viewport.
 * Starts off-screen (translateY 100%) and slides up when JS adds .visible.
 * z-index 200 — above floating chat button (z-50) and Sonner (z-[100]).
 * JS in footer.php handles show/hide and pushes the chat button up while
 * the banner is visible so the two never overlap.
 */
#cookie-banner {
    position:              fixed;
    bottom:                0;
    left:                  0;
    right:                 0;
    z-index:               200;
    background:            rgba(3, 7, 18, 0.97);
    backdrop-filter:       blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top:            1px solid rgba(255, 255, 255, 0.1);
    box-shadow:            0 -8px 32px rgba(0, 0, 0, 0.4);
    transform:             translateY(100%);
    transition:            transform 0.35s cubic-bezier(.4, 0, .2, 1);
}

#cookie-banner.visible {
    transform: translateY(0);
}


/* ------------------------------------------------------------
   6. Partners logo carousel — infinite marquee
   ------------------------------------------------------------ */

.partners-section {
    padding-top:    4rem;          /* py-16 */
    padding-bottom: 4rem;
    border-top:     1px solid hsl(var(--border));   /* border-y */
    border-bottom:  1px solid hsl(var(--border));
    overflow:       hidden;        /* overflow-hidden */
    background-color: #fff;        /* bg-white */
}

/*
 * Layout only — animation is driven by JS (requestAnimationFrame) in
 * index.php so it measures real pixel widths after layout and works
 * correctly at every viewport width.
 */
.partners-strip {
    display:     flex;
    gap:         2rem;      /* 32 px — matches Tailwind gap-8 */
    align-items: center;
    width:       max-content;
    will-change: transform; /* promote to GPU compositor layer */
}


/* ------------------------------------------------------------
   7. Iframe
   ------------------------------------------------------------ */

        #poistenieonline {
            width:   100%;
            height:  500px; /* Default; overridden dynamically by JS */
            border:  0;
            margin:  0;
            padding: 0;
        }
        #poistenieonline iframe {
            width:   100%;
            height:  100%;
            border:  0;
            margin:  0;
            padding: 0;
        }


/* ------------------------------------------------------------
   8. Product detail cards — produkty.php
   ------------------------------------------------------------ */

/*
 * Outer background section that wraps all product cards.
 * Replaces: bg-gray-50 py-12 pb-20
 *   bg-gray-50 → background-color rgb(249 250 251)
 *   py-12      → padding-top/bottom 3 rem
 *   pb-20      → padding-bottom 5 rem  (overrides py-12 bottom)
 */
.product-section {
    background-color: #fff;  /* bg-gray-50 */
    padding-top:      3rem;                /* py-12 */
    padding-bottom:   5rem;                /* pb-20 */
}


/*
 * Stack that holds all product cards vertically.
 * Replaces: flex flex-col gap-6
 *   flex      → display flex         (already in bundle)
 *   flex-col  → flex-direction column
 *   gap-6     → gap 1.5rem
 */
.product-cards-stack {
    display:        flex;
    flex-direction: column;
    /* gap:            1.5rem;  /* gap-6 */ */
    /* margin-top:       30px;              */ 
}


/*
 * Outer wrapper of each product detail card.
 * Replaces: bg-white rounded-2xl border border-gray-200 overflow-hidden
 *   bg-white        → background-color #fff
 *   rounded-2xl     → border-radius 1rem
 *   border          → border-width 1px  (border-style solid via Tailwind preflight)
 *   border-gray-200 → border-color rgb(229 231 235)  [NOT in compiled bundle]
 *   overflow-hidden → overflow hidden
 */
.product-card {
    scroll-margin-top: 100px; /* offset for fixed navbar when arriving via anchor link */
    background-color: var(--bg-card);
    border-radius:    var(--radius-lg);
    border-width:     1px;
    border-style:     solid;
    border-color:     var(--border-card);
    overflow:         hidden;
    margin-bottom:    var(--space-12); /* 3rem — consistent spacing-scale step */
}

/* ── Scroll-reveal animation (added/removed by IntersectionObserver in produkty.php) ── */
@media (prefers-reduced-motion: no-preference) {
    .product-card {
        transition: opacity 0.55s ease,
                    transform 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    .product-card.scroll-hidden {
        opacity:   0;
        transform: translateY(36px);
    }
}


/*
 * Footer area of each product detail card.
 * Contains the primary CTA button ("Vypočítaj cenu").
 * Replaces: px-8 pb-8  →  padding: 0 2rem 2rem
 *   px-8 = padding-left/right 2 rem  (Tailwind spacing-8)
 *   pb-8 = padding-bottom     2 rem
 */
.product-card-cta {
    padding-left:   var(--space-8);  /* px-8 — 2rem */
    padding-right:  var(--space-8);
    padding-bottom: var(--space-8);
    margin-top:     var(--space-3);  /* 0.75rem — tidy gap above button */
    margin-bottom:  var(--space-3);
}

/*
 * Icon + title header row inside each product card.
 * Background is one shade darker than --bg-card to create a visible header band.
 * Replaces: px-8 py-6 flex items-center gap-4
 */
.product-card-header {
    padding-left:    var(--space-8);   /* px-8 — 2 rem */
    padding-right:   var(--space-8);
    padding-top:     var(--space-6);   /* py-6 — 1.5 rem */
    padding-bottom:  var(--space-6);
    display:         flex;
    align-items:     center;
    gap:             var(--space-4);   /* gap-4 — 1 rem */
    background-color: rgb(237, 238, 239); /* intentionally darker than --bg-card for header band */
}

/*
 * Content body grid inside each product card.
 * Replaces: px-8 py-7 grid md:grid-cols-2 gap-8 lg:gap-16
 */
.product-card-body {
    padding-left:  var(--space-8);   /* px-8 — 2rem */
    padding-right: var(--space-8);
    padding-top:   1.75rem;          /* py-7 */
    padding-bottom: 1.75rem;
    display:       grid;
    gap:           var(--space-8);   /* gap-8 — 2rem */
}

@media (min-width: 768px) {  /* md: */
    .product-card-body {
        grid-template-columns: repeat(2, minmax(0, 1fr)); /* grid-cols-2 */
    }
}

@media (min-width: 1024px) { /* lg: */
    .product-card-body {
        gap: 4rem; /* lg:gap-16 */
    }
}

/*
 * Primary CTA button used inside each product card.
 * Replaces: inline-flex items-center gap-2 px-6 py-3
 *           bg-primary text-primary-foreground rounded-xl
 *           font-semibold text-sm hover:bg-primary/90 transition-all
 */
.btn-primary {
    display:          inline-flex;
    align-items:      center;
    gap:              0.5rem;
    padding:          0.75rem 1.5rem;    /* py-3 px-6 */
    background-color: hsl(var(--primary));
    color:            hsl(var(--primary-foreground));
    border-radius:    var(--radius-md);  /* rounded-xl — unified with inputs and icons */
    font-weight:      600;
    font-size:        0.875rem;
    line-height:      1.25rem;
    text-decoration:  none;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-duration: .15s;
}

.btn-primary:hover {
    opacity: 0.9; /* matches hover:bg-primary/90 intent — reliable across all themes */
}

/*
 * Small uppercase label used above "O produkte" / "Čo je kryté" columns.
 * Replaces: text-xs font-semibold text-primary uppercase tracking-wider mb-4
 *   text-xs          → font-size 0.75 rem; line-height 1 rem
 *   font-semibold    → font-weight 600
 *   text-primary     → color hsl(var(--primary))
 *   uppercase        → text-transform uppercase
 *   tracking-wider   → letter-spacing 0.05 em
 *   mb-4             → margin-bottom 1 rem
 */
.product-label {
    font-size:      0.75rem;              /* text-xs */
    line-height:    1rem;
    font-weight:    600;                  /* font-semibold */
    color:          hsl(var(--primary));  /* text-primary */
    text-transform: uppercase;            /* uppercase */
    letter-spacing: 0.05em;              /* tracking-wider */
    margin-bottom:  1rem;                 /* mb-4 */
}

/*
 * Info callout box inside each product card body.
 * Replaces: mt-5 p-4 rounded-xl bg-primary/5 border border-primary/10 flex items-start gap-3
 *   mt-5             → margin-top 1.25 rem
 *   p-4              → padding 1 rem
 *   rounded-xl       → border-radius 0.75 rem
 *   bg-primary/5     → background-color hsl(var(--primary) / 0.05)
 *   border           → border-width 1px; border-style solid
 *   border-primary/10 → border-color hsl(var(--primary) / 0.1)
 *   flex             → display flex
 *   items-start      → align-items flex-start
 *   gap-3            → gap 0.75 rem
 */
.info-callout {
    margin-top:       var(--space-5);                /* mt-5 — 1.25 rem */
    padding:          var(--space-4);                /* p-4  — 1 rem    */
    border-radius:    var(--radius-md);              /* rounded-xl      */
    background-color: hsl(var(--primary) / 0.05);
    border-width:     1px;
    border-style:     solid;
    border-color:     hsl(var(--primary) / 0.1);
    display:          flex;
    align-items:      flex-start;
    gap:              var(--space-3);                /* gap-3 — 0.75 rem */
}


/* ------------------------------------------------------------
   9. O nás page — company intro section
   ------------------------------------------------------------ */

/* Section outer — white page background */
.about-intro-section {
    background-color: #fff;
    padding-top:      0.1rem;
    padding-bottom:   3rem;
}

/*
 * Card wrapper — gray background, rounded corners, solid green border.
 * Intentionally uses --radius-xl (1.5rem) as a featured/hero-level card.
 */
.about-intro-card {
    /*
    background-color: var(--bg-card);
    border-radius:    var(--radius-xl);
    border:           1px solid hsl(var(--border));
    */
    padding:          2.5rem 2rem;
}

@media (min-width: 768px) {
    .about-intro-card {
        padding: 0rem 0rem;
    }
}

/*
 * Two-column intro layout: text left, shield illustration right.
 * Single column on mobile, side-by-side on md+.
 */
.about-intro-grid {
    display:     grid;
    gap:         3rem;       /* gap-12 */
    align-items: center;
}

@media (min-width: 768px) {
    .about-intro-grid {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }
}

@media (min-width: 1024px) {
    .about-intro-grid {
        gap: 5rem;           /* lg:gap-20 */
    }
}

/* Body text column — stacked paragraphs with muted colour */
.about-body {
    display:        flex;
    font-size:      1.2rem;
    flex-direction: column;
    gap:            1rem;    /* gap-4 */
    color:          hsl(var(--muted-foreground));
    line-height:    1.625;   /* leading-relaxed */
    margin-top:     1.5rem;  /* mt-6 */
    margin-bottom:  0;
}

.about-body strong {
    font-weight: 600;
    color:       hsl(var(--foreground));
}

/* Stats row — 2 cols on mobile, 4 cols on sm+ */
.about-stats {
    display:               grid;
    grid-template-columns: repeat(2, 1fr);
    gap:                   0.75rem;
    margin-top:            2rem;   /* mt-8 */
}

@media (min-width: 640px) {
    .about-stats {
        grid-template-columns: repeat(4, 1fr);
    }
}

.about-stat {
    display:          flex;
    flex-direction:   column;
    align-items:      center;
    text-align:       center;
    padding:          var(--space-4);
    border-radius:    var(--radius-md);              /* rounded-xl */
    background-color: hsl(var(--primary) / 0.05);
    border:           1px solid hsl(var(--primary) / 0.1);
    gap:              0.2rem;
}

.about-stat-value {
    font-size:   1.25rem;          /* text-xl */
    font-weight: 700;              /* font-bold */
    color:       hsl(var(--primary));
    line-height: 1.2;
}

.about-stat-label {
    font-size:   0.75rem;          /* text-xs */
    color:       hsl(var(--muted-foreground));
    line-height: 1.4;
}

/* Shield illustration wrapper */
.about-shield-wrap {
    display:         flex;
    align-items:     center;
    justify-content: center;
    padding:         2rem;
}

.about-shield-svg {
    width:     100%;
    max-width: 220px;
    height:    auto;
}

.about-brand-svg {
    width:      100%;
    max-width:  272px;   /* 340 × 0.8 — 20 % smaller */
    height:     auto;
    display:    block;
    margin:     auto;    /* centres inside the flex wrapper */
}


/* ------------------------------------------------------------
   10. o-nas.php — page heading + feature cards
   ------------------------------------------------------------ */

/*
 * Page <h1> on the O nás page.
 * Replaces: text-4xl md:text-5xl font-bold tracking-tight text-foreground leading-tight
 * clamp() gives fluid scaling: 40px floor on small phones → reaches 64px at ~800px+
 */
.onas-page-heading {
    font-size:      clamp(2.5rem, 8vw, 4rem); /* fluid: 40px → 64px */
    font-weight:    700;                       /* font-bold */
    letter-spacing: -0.025em;                 /* tracking-tight */
    color:          hsl(var(--foreground));    /* text-foreground */
    line-height:    1.2;                       /* leading-tight, slightly tighter for large sizes */
}

/* Section wrapper */
.products-overview-section {
    /*background-color: rgb(249, 250, 251);*/
    background-color: #fff;
    padding-top:      3rem;
    padding-bottom:   5rem;
}

/* Vertical stack of cards */
.product-feature-stack {
    display:        flex;
    flex-direction: column;
    gap:            1rem;
    margin-top:     2rem;
}

/*
 * Individual card — single column on mobile, row on md+.
 * Left col (icon/title/desc) separated from right col (2×2 items)
 * by a 1px divider on md+.
 */
.product-feature-card {
    display:          flex;
    flex-direction:   column;
    gap:              1.25rem;
    padding:          var(--space-6);
    background-color: var(--bg-card);
    border:           1px solid var(--border-card);
    border-radius:    var(--radius-lg);
}

@media (min-width: 768px) {
    .product-feature-card {
        flex-direction: row;
        gap:            0;
        align-items:    center;
    }
}

/* Left column: icon + title + description */
.product-feature-left {
    display:        flex;
    flex-direction: column;
}

@media (min-width: 768px) {
    .product-feature-left {
        flex:          0 0 27%;
        padding-right: 1.75rem;
        border-right:  1px solid rgb(229, 231, 235);
    }
}

.product-feature-icon {
    width:            2.5rem;
    height:           2.5rem;
    border-radius:    var(--radius-md);          /* rounded-xl — matches product-card icons */
    background-color: hsl(var(--primary) / 0.08);
    display:          flex;
    align-items:      center;
    justify-content:  center;
    margin-bottom:    var(--space-3);
    flex-shrink:      0;
}

.product-feature-title {
    font-size:     1rem;
    font-weight:   700;
    color:         hsl(var(--foreground));
    margin-bottom: 0.375rem;
    line-height:   1.3;
}

.product-feature-desc {
    font-size:   0.8125rem;
    color:       hsl(var(--muted-foreground));
    line-height: 1.6;
}

/* Right column: 2×2 grid of items */
.product-feature-items {
    display:               grid;
    grid-template-columns: 1fr;
    gap:                   0.5rem;
}

@media (min-width: 480px) {
    .product-feature-items {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .product-feature-items {
        flex:         1;
        padding-left: 1.75rem;
    }
}

/* Single feature item tile */
.product-feature-item {
    display:          flex;
    align-items:      center;           /* vertically centred */
    gap:              0.5rem;
    padding:          0.625rem 0.875rem;
    border-radius:    0.625rem;         /* slightly larger corners */
    background-color: rgb(229, 231, 235); /* gray-200 — visible contrast */
    font-size:        0.8125rem;
    line-height:      1.45;
}

.product-feature-arrow {
    color:       hsl(var(--primary));
    font-weight: 700;
    font-size:   0.9375rem;
    flex-shrink: 0;
}

.product-feature-text {
    color: #000;
}


/* ------------------------------------------------------------
   11. Product feature card — scroll-reveal bounce animation
   ------------------------------------------------------------ */

/*
 * Cards start hidden + shifted down when JS marks them with
 * .will-animate. IntersectionObserver then adds .is-visible
 * which fires the keyframe and makes them bounce into place.
 * Cascade delay is set inline via style="animation-delay:Nms".
 */
.product-feature-card.will-animate {
    opacity:   0;
    transform: translateY(48px);
}

.product-feature-card.is-visible {
    animation: card-bounce-in 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes card-bounce-in {
    from { opacity: 0; transform: translateY(48px); }
    to   { opacity: 1; transform: translateY(0);    }
}

/* Respect user's reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
    .product-feature-card.will-animate { opacity: 1; transform: none; }
    .product-feature-card.is-visible   { animation: none; }
}


/* ------------------------------------------------------------
   12. CTA banner — o-nas.php "Vypočítať poistné"
   ------------------------------------------------------------ */

/* Full-width green gradient banner */
.cta-banner {
    background: linear-gradient(135deg, hsl(142, 65%, 36%) 0%, hsl(142, 72%, 24%) 100%);
    padding-top:    5rem;
    padding-bottom: 5rem;
    text-align:     center;
}

/* Inner centred column — constrained width */
.cta-banner-inner {
    display:        flex;
    flex-direction: column;
    align-items:    center;
    gap:            1.25rem;
    max-width:      40rem;
    margin-left:    auto;
    margin-right:   auto;
}

/* Small pill above the heading */
.cta-banner-badge {
    display:       inline-flex;
    align-items:   center;
    gap:           0.5rem;
    padding:       0.375rem 1rem;
    border-radius: 9999px;
    background:    rgba(255, 255, 255, 0.15);
    border:        1px solid rgba(255, 255, 255, 0.25);
    color:         white;
    font-size:     0.875rem;
    font-weight:   500;
}

/* Main heading */
.cta-banner-heading {
    font-size:      2.25rem;
    font-weight:    700;
    color:          white;
    line-height:    1.15;
    letter-spacing: -0.025em;
    margin:         0;
}

@media (min-width: 768px) {
    .cta-banner-heading { font-size: 2.75rem; }
}

/* Supporting copy below heading */
.cta-banner-text {
    color:       rgba(255, 255, 255, 0.82);
    font-size:   1.0625rem;
    line-height: 1.625;
    max-width:   34rem;
    margin:      0;
}

/* White button used on coloured backgrounds */
.btn-white {
    display:          inline-flex;
    align-items:      center;
    gap:              0.5rem;
    padding:          0.875rem 2rem;
    background-color: var(--bg-surface);
    color:            hsl(var(--primary));
    border-radius:    var(--radius-md);  /* rounded-xl — matches btn-primary */
    font-weight:      600;
    font-size:        0.9375rem;
    line-height:      1.25rem;
    text-decoration:  none;
    margin-top:       0.5rem;
    box-shadow:       0 4px 14px rgba(0, 0, 0, 0.13);
    transition:       all 0.18s cubic-bezier(.4, 0, .2, 1);
}

.btn-white:hover {
    background-color: rgba(255, 255, 255, 0.91);
    transform:        translateY(-1px);
    box-shadow:       0 6px 22px rgba(0, 0, 0, 0.18);
}


/* ------------------------------------------------------------
   Legal pages — ochrana-osobnych-udajov.php / obchodne-podmienky.php
   ------------------------------------------------------------ */

/* Section wrapper */
.legal-section {
    background-color: rgb(249, 250, 251);
    padding-top:      3rem;
    padding-bottom:   5rem;
}

/* Centred, constrained prose column */
.legal-body {
    max-width:    52rem;
    margin-left:  auto;
    margin-right: auto;
    display:      flex;
    flex-direction: column;
    gap:          2.5rem;
}

/* Individual numbered section block */
.legal-block {
    display:        flex;
    flex-direction: column;
    gap:            0.75rem;
    font-size:      0.9375rem;
    line-height:    1.75;
    color:          hsl(var(--muted-foreground));
}

/* Section heading */
.legal-h2 {
    font-size:   1.125rem;
    font-weight: 700;
    color:       hsl(var(--foreground));
    padding-bottom: 0.5rem;
    border-bottom:  2px solid hsl(var(--primary) / 0.15);
    margin-bottom:  0.25rem;
}

/* Bullet list */
.legal-list {
    padding-left: 1.25rem;
    display:      flex;
    flex-direction: column;
    gap:          0.5rem;
    list-style:   disc;
}

.legal-list li {
    padding-left: 0.25rem;
}

/* Highlighted info card (company details, authority details) */
.legal-card {
    background-color: hsl(var(--primary) / 0.04);
    border:           1px solid hsl(var(--primary) / 0.15);
    border-left:      3px solid hsl(var(--primary));
    border-radius:    0.75rem;
    padding:          1rem 1.25rem;
    display:          flex;
    flex-direction:   column;
    gap:              0.25rem;
    font-size:        0.875rem;
    line-height:      1.6;
}

.legal-card strong {
    color:       hsl(var(--foreground));
    font-weight: 600;
}

/* Inline links */
.legal-link {
    color:           hsl(var(--primary));
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-link:hover {
    opacity: 0.8;
}

/* Comparison table (used on privacy policy) */
.legal-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
    line-height:     1.5;
    overflow:        hidden;
    border-radius:   0.75rem;
    border:          1px solid rgb(229, 231, 235);
}

.legal-table thead tr {
    background-color: hsl(var(--primary));
    color:            white;
}

.legal-table th {
    padding:    0.75rem 1rem;
    text-align: left;
    font-weight: 600;
    font-size:   0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.legal-table td {
    padding:      0.75rem 1rem;
    border-top:   1px solid rgb(243, 244, 246);
    vertical-align: top;
    color:        hsl(var(--muted-foreground));
}

.legal-table tbody tr:nth-child(odd) {
    background-color: white;
}

.legal-table tbody tr:nth-child(even) {
    background-color: rgb(249, 250, 251);
}

@media (max-width: 640px) {
    .legal-table,
    .legal-table thead,
    .legal-table tbody,
    .legal-table th,
    .legal-table td,
    .legal-table tr { display: block; }

    .legal-table thead tr { display: none; }

    .legal-table td {
        border-top: none;
        border-bottom: 1px solid rgb(243, 244, 246);
        padding: 0.5rem 1rem;
    }

    .legal-table td::before {
        content:     attr(data-label);
        font-weight: 600;
        color:       hsl(var(--foreground));
        display:     block;
        font-size:   0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        margin-bottom: 0.2rem;
    }
}


/* ------------------------------------------------------------
   15. Google Reviews carousel
   ------------------------------------------------------------ */

.reviews-section {
    background-color: #f9fafb;
    padding-top:      5rem;
    padding-bottom:   5rem;
}

/* Header row — left (badge + heading + rating) / right (controls) */
.reviews-header {
    display:         flex;
    justify-content: space-between;
    align-items:     flex-end;
    flex-wrap:       wrap;
    gap:             1.5rem;
    margin-bottom:   2.5rem;
}

.reviews-google-badge {
    display:        inline-flex;
    align-items:    center;
    gap:            0.5rem;
    font-size:      0.75rem;
    font-weight:    700;
    letter-spacing: 0.08em;
    color:          #6b7280;
    margin-bottom:  0.75rem;
}

.reviews-heading {
    font-size:     2.25rem;
    font-weight:   700;
    line-height:   1.2;
    color:         hsl(var(--foreground));
    margin-bottom: 0.75rem;
}

.reviews-summary {
    display:     flex;
    align-items: center;
    gap:         0.625rem;
}

.reviews-stars {
    color:          #f59e0b;
    font-size:      1.125rem;
    letter-spacing: -0.04em;
}

.reviews-score {
    font-size:   1.375rem;
    font-weight: 700;
    color:       hsl(var(--foreground));
}

.reviews-count {
    font-size: 0.875rem;
    color:     hsl(var(--muted-foreground));
}

/* Prev / Next + link row */
.reviews-controls {
    display:     flex;
    align-items: center;
    gap:         0.625rem;
}

.reviews-btn {
    width:           2.5rem;
    height:          2.5rem;
    border-radius:   50%;
    border:          1px solid rgb(229, 231, 235);
    background:      #ffffff;
    display:         flex;
    align-items:     center;
    justify-content: center;
    cursor:          pointer;
    color:           hsl(var(--foreground));
    transition:      background 0.15s, border-color 0.15s;
    flex-shrink:     0;
}

.reviews-btn:hover:not(:disabled) {
    background:   hsl(var(--primary) / 0.08);
    border-color: hsl(var(--primary));
}

.reviews-btn:disabled {
    opacity: 0.4;
    cursor:  default;
}

.reviews-all-link {
    font-size:       0.875rem;
    font-weight:     600;
    color:           hsl(var(--primary));
    text-decoration: none;
    white-space:     nowrap;
    transition:      opacity 0.15s;
}

.reviews-all-link:hover { opacity: 0.75; }

/* Carousel track */
/* Matches .fbs-track exactly — native scroll, no JS transform, no wrapper needed */
.reviews-track {
    display:                    flex;
    gap:                        1.5rem;
    overflow-x:                 auto;
    scroll-snap-type:           x mandatory;
    scroll-behavior:            smooth;
    -webkit-overflow-scrolling: touch;
    touch-action:               pan-x;
    padding:                    .5rem 0 1.25rem;
    scrollbar-width:            none;
}
.reviews-track::-webkit-scrollbar { display: none; }

/* Review card — same width progression as .fbs-card */
.review-card {
    flex-shrink:       0;
    width:             290px;
    scroll-snap-align: start;
    box-sizing:        border-box;
    background:        var(--bg-surface);
    border-radius:     var(--radius-lg);
    border:            1px solid var(--border-card);
    padding:           var(--space-6);
    transition:        box-shadow .2s, transform .2s;
}
.review-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,.09); transform: translateY(-2px); }
@media (min-width: 768px)  { .review-card { width: 300px; } }
@media (min-width: 1024px) { .review-card { width: 320px; } }

/* Hide img avatars that have no src or fail to load — shows initial fallback */
.review-avatar img:not([src]),
.review-avatar img[src=""] { display: none; }

.review-card-header {
    display:       flex;
    align-items:   center;
    gap:           0.75rem;
    margin-bottom: 0.625rem;
}

.review-avatar {
    width:           3rem;
    height:          3rem;
    border-radius:   50%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-weight:     700;
    font-size:       1.125rem;
    color:           #ffffff;
    flex-shrink:     0;
    position:        relative;
    overflow:        hidden;
}

/* Photo — absolutely fills the circle; onerror hides it, revealing the initial beneath */
.review-avatar img {
    position:      absolute;
    inset:         0;
    width:         100%;
    height:        100%;
    object-fit:    cover;
    border-radius: 50%;
}

.review-name {
    font-weight: 600;
    font-size:   0.9375rem;
    color:       hsl(var(--foreground));
    line-height: 1.3;
}

.review-time {
    font-size: 0.8125rem;
    color:     hsl(var(--muted-foreground));
}

.review-card-stars {
    color:          #f59e0b;
    font-size:      1rem;
    letter-spacing: -0.03em;
    margin-bottom:  0.625rem;
}

.review-text {
    font-size:   0.875rem;
    color:       hsl(var(--muted-foreground));
    line-height: 1.65;
}

/* ─── Mobile: Google Reviews — all classes ───────────────────────
   Breakpoint 767px: tablets and phones
   Breakpoint 479px: small phones (SE, older Android)
   ---------------------------------------------------------------- */

@media (max-width: 767px) {

    /* ── Section ────────────────────────────────────────────────── */
    .reviews-section {
        padding-top:    2.5rem;
        padding-bottom: 2.5rem;
    }

    /* ── Header block: stack left column above controls ─────────── */
    .reviews-header {
        flex-direction: column;
        align-items:    flex-start;
        gap:            1.25rem;
        margin-bottom:  1.5rem;
    }

    /* ── Google badge ───────────────────────────────────────────── */
    .reviews-google-badge {
        font-size:     0.6875rem;
        margin-bottom: 0.5rem;
    }

    /* ── Heading ────────────────────────────────────────────────── */
    .reviews-heading {
        font-size:     1.625rem;
        margin-bottom: 0.5rem;
    }

    /* ── Summary row (stars + score + count) ────────────────────── */
    .reviews-summary { gap: 0.5rem; }

    .reviews-stars {
        font-size:      1rem;
        letter-spacing: -0.03em;
    }

    .reviews-score {
        font-size:   1.125rem;
        font-weight: 700;
    }

    .reviews-count { font-size: 0.8125rem; }

    /* ── Controls: span full width; buttons left, link right ─────── */
    .reviews-controls {
        width:           100%;
        justify-content: space-between;
        gap:             0.75rem;
    }

    /* ── Prev / Next buttons: slightly smaller ──────────────────── */
    .reviews-btn {
        width:  2.25rem;
        height: 2.25rem;
    }

    /* ── "Zobraziť" link ────────────────────────────────────────── */
    .reviews-all-link {
        font-size:  0.8125rem;
        white-space: normal;
    }

    /* ── Carousel track: tighter gap ────────────────────────────── */
    .reviews-track { gap: 0.875rem; }

    /* ── Review card ────────────────────────────────────────────── */
    .review-card {
        padding:       1.25rem;
        border-radius: 0.875rem;
    }

    /* ── Card header row ────────────────────────────────────────── */
    .review-card-header {
        gap:           0.625rem;
        margin-bottom: 0.5rem;
    }

    /* ── Avatar circle ──────────────────────────────────────────── */
    .review-avatar {
        width:     2.5rem;
        height:    2.5rem;
        font-size: 0.9375rem;
    }

    /* ── Name & time ────────────────────────────────────────────── */
    .review-name { font-size: 0.875rem; }
    .review-time { font-size: 0.75rem; }

    /* ── Card stars ─────────────────────────────────────────────── */
    .review-card-stars {
        font-size:     0.9375rem;
        margin-bottom: 0.5rem;
    }

    /* ── Review text ────────────────────────────────────────────── */
    .review-text {
        font-size:   0.8125rem;
        line-height: 1.6;
    }
}

@media (max-width: 479px) {

    /* ── Section: even tighter on tiny phones ───────────────────── */
    .reviews-section {
        padding-top:    2rem;
        padding-bottom: 2rem;
    }

    /* ── Heading: fit on one line on smallest screens ───────────── */
    .reviews-heading { font-size: 1.375rem; }

    /* ── Controls: "Zobraziť" link wraps to its own row ─────────── */
    .reviews-controls {
        flex-wrap:       wrap;
        justify-content: flex-start;
        gap:             0.5rem;
    }

    .reviews-all-link {
        width:      100%;
        margin-top: 0.125rem;
        font-size:  0.8125rem;
    }

    /* ── Card: tightest padding ─────────────────────────────────── */
    .review-card { padding: 1rem; }

    /* ── Track: tightest gap ────────────────────────────────────── */
    .reviews-track { gap: 0.75rem; }
}


/* §16 ── Blog ──────────────────────────────────────────────────────────────
   Public blog listing (blog.php) and single post (blog-post.php)
   ------------------------------------------------------------ */

.blog-section {
    padding-top:    3.5rem;
    padding-bottom: 5rem;
    background:     #ffffff;
}

.blog-grid {
    display:               grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap:                   1.5rem;
    margin-bottom:         2.5rem;
}

.blog-card {
    background:    var(--bg-surface);
    border:        1px solid var(--border-card);
    border-radius: var(--radius-lg);
    padding:       var(--space-6);
    display:       flex;
    flex-direction: column;
    gap:           .75rem;
    transition:    box-shadow .2s, border-color .2s;
}

.blog-card:hover {
    box-shadow:   var(--shadow-hover);
    border-color: var(--border-input);  /* slightly darker border on hover */
}

.blog-card-meta {
    display:        flex;
    flex-direction: column;
    gap:            .4375rem;
    font-size:      .8125rem;
    color:          hsl(var(--muted-foreground));
}

/* Horizontal row inside the meta block (badge row / date+author row) */
.blog-meta-row {
    display:     flex;
    align-items: center;
    gap:         .4375rem;
    flex-wrap:   wrap;
}

/* Icon + label pair (calendar + date, person + author) */
.blog-meta-item {
    display:     inline-flex;
    align-items: center;
    gap:         .3125rem;
}
.blog-meta-item svg { flex-shrink: 0; opacity: .5; }

.blog-card-sep { color: rgb(209,213,219); }

.blog-card-title {
    font-size:   1.0625rem;
    font-weight: 700;
    line-height: 1.35;
    margin:      0;
    color:       hsl(var(--foreground));
}

.blog-card-title a {
    color:           inherit;
    text-decoration: none;
    transition:      color .15s;
}

.blog-card-title a:hover { color: hsl(var(--primary)); }

.blog-card-excerpt {
    font-size:   .875rem;
    color:       hsl(var(--muted-foreground));
    line-height: 1.6;
    flex:        1;
    margin:      0;
    display:             -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp:         3;
    -webkit-box-orient: vertical;
    overflow:           hidden;
}

.blog-card-link {
    display:         inline-flex;
    align-items:     center;
    gap:             .375rem;
    font-size:       .875rem;
    font-weight:     600;
    color:           hsl(var(--primary));
    text-decoration: none;
    margin-top:      auto;
    transition:      gap .15s;
}

.blog-card-link:hover { gap: .625rem; }

/* ── Pagination ─────────────────────────────────────── */
.blog-pagination {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             .375rem;
    flex-wrap:       wrap;
    margin-top:      2rem;
}

.blog-pag-btn {
    display:         inline-flex;
    align-items:     center;
    padding:         .4rem .875rem;
    border:          1px solid var(--border-card);
    border-radius:   var(--radius-sm);            /* rounded-lg */
    font-size:       .875rem;
    color:           hsl(var(--foreground));
    text-decoration: none;
    transition:      background .15s, border-color .15s;
    background:      var(--bg-surface);
}

.blog-pag-btn:hover       { background: rgb(249,250,251); border-color: rgb(209,213,219); }
.blog-pag-current         { background: hsl(var(--primary)); border-color: hsl(var(--primary)); color: #ffffff !important; }
.blog-pag-current:hover   { background: hsl(var(--primary)); }
.blog-pag-ellipsis        { border-color: transparent; cursor: default; }

/* ── Single post ────────────────────────────────────── */

.blog-post-section {
    padding-top:    2.5rem;
    padding-bottom: 5rem;
    background:     hsl(var(--background));
}

.blog-post-views {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    font-size: .8125rem;
    color: hsl(var(--muted-foreground));
    margin: .375rem 0 0;
}

/* § 16b. Blog post body — full prose typography
   Tailwind preflight resets list-style, font-weight, text-decoration, etc.
   All prose semantics must be restored explicitly here.
   font-family is set explicitly (not inherited) to survive any TinyMCE
   inline-style override and ensure Plus Jakarta Sans is always used.       */
.blog-post-body {
    font-family: var(--font-jakarta), "Plus Jakarta Sans", sans-serif;
    font-size:   1rem;
    line-height: 1.75;
    color:       hsl(var(--foreground));
}

/* ── First / last child margin reset ── */
.blog-post-body > *:first-child { margin-top:    0; }
.blog-post-body > *:last-child  { margin-bottom: 0; }

/* ── Headings ── */
.blog-post-body h2,
.blog-post-body h3,
.blog-post-body h4 {
    color:       hsl(var(--foreground));
    font-weight: 700;
    line-height: 1.3;
}
.blog-post-body h2 {
    font-size:      1.5rem;
    letter-spacing: -0.015em;
    margin:         2rem 0 .75rem;
}
.blog-post-body h3 {
    font-size:      1.25rem;
    letter-spacing: -0.01em;
    margin:         1.75rem 0 .625rem;
}
.blog-post-body h4 {
    font-size:   1.0625rem;
    font-weight: 600;
    margin:      1.5rem 0 .5rem;
}

/* ── Paragraph ── */
.blog-post-body p { margin: 0 0 1.25rem; }

/* ── Inline emphasis (Tailwind preflight strips these) ── */
.blog-post-body strong,
.blog-post-body b {
    font-weight: 700;
    color:       hsl(var(--foreground));
}
.blog-post-body em,
.blog-post-body i { font-style: italic; }

/* ── Links ── */
.blog-post-body a {
    color:                 hsl(var(--primary));
    text-decoration:       underline;
    text-underline-offset: 3px;
    text-decoration-color: hsl(var(--primary) / .4);
    transition:            text-decoration-color 150ms;
}
.blog-post-body a:hover { text-decoration-color: hsl(var(--primary)); }

/* ── Lists (Tailwind preflight removes list-style-type) ── */
.blog-post-body ul,
.blog-post-body ol {
    margin:       0 0 1.25rem;
    padding-left: 1.5rem;
}
.blog-post-body ul { list-style-type: disc; }
.blog-post-body ol { list-style-type: decimal; }
.blog-post-body li {
    display:       list-item;
    margin-bottom: .375rem;
}
/* Nested lists — tighter indent, alternate markers */
.blog-post-body li > ul {
    list-style-type: circle;
    margin:          .375rem 0 .375rem 1rem;
}
.blog-post-body li > ol {
    list-style-type: lower-alpha;
    margin:          .375rem 0 .375rem 1rem;
}

/* ── Blockquote ── */
.blog-post-body blockquote {
    border-left:   3px solid hsl(var(--primary));
    margin:        1.5rem 0;
    padding:       .75rem 1.25rem;
    background:    hsl(var(--primary) / 0.05);
    border-radius: 0 .5rem .5rem 0;
    font-style:    italic;
    color:         hsl(var(--muted-foreground));
}

/* ── Inline code & code blocks ── */
.blog-post-body code {
    font-family:      ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size:        .875em;
    background:       rgb(243,244,246);
    color:            hsl(var(--foreground));
    padding:          .125em .35em;
    border-radius:    .25rem;
    border:           1px solid rgb(229,231,235);
}
.blog-post-body pre {
    background:    rgb(243,244,246);
    border:        1px solid rgb(229,231,235);
    border-radius: .5rem;
    padding:       1rem 1.25rem;
    margin:        1.5rem 0;
    overflow-x:    auto;
    font-size:     .875rem;
    line-height:   1.6;
}
.blog-post-body pre code {
    background: none;
    border:     none;
    padding:    0;
    font-size:  inherit;
}

/* ── Horizontal rule ── */
.blog-post-body hr {
    border:        none;
    border-top:    1px solid rgb(229,231,235);
    margin:        2rem 0;
}

/* ── Images ── */
.blog-post-body img {
    display:       block;
    height:        auto;
    max-width:     100%;
    border-radius: .75rem;
    margin:        1.5rem 0;
}

/* ── Tables ── */
.blog-post-body table {
    width:           100%;
    border-collapse: collapse;
    margin:          1.5rem 0;
    font-size:       .9rem;
    text-align:      left;
}
.blog-post-body th,
.blog-post-body td {
    padding: .5rem .875rem;
    border:  1px solid rgb(229,231,235);
}
.blog-post-body th { background: rgb(249,250,251); font-weight: 600; }

.blog-post-footer {
    margin-top:   3rem;
    padding-top:  1.5rem;
    border-top:   1px solid rgb(229,231,235);
}

.blog-post-back {
    display:         inline-flex;
    align-items:     center;
    gap:             .5rem;
    font-size:       .875rem;
    font-weight:     600;
    color:           hsl(var(--muted-foreground));
    text-decoration: none;
    transition:      color .15s, gap .15s;
}

.blog-post-back:hover { color: hsl(var(--foreground)); gap: .75rem; }


/* §16b ── Blog — search, filter pills, cover image, category badge ─────────
   Extensions to §16 above — keep in sync with blog-section styles
   ──────────────────────────────────────────────────────────────────────── */

/* ── Toolbar: search + pills row ──────────────────────────────── */
.blog-toolbar {
    margin-bottom: 2rem;
    display:       flex;
    flex-direction: column;
    gap:           1rem;
}

/* ── Search form ───────────────────────────────────────────────── */
.blog-search-form {
    display:     flex;
    align-items: center;
    gap:         .5rem;
}

.blog-search-wrap {
    position:  relative;
    flex:      1;
    max-width: 26rem;
}

.blog-search-icon {
    position:       absolute;
    left:           .875rem;
    top:            50%;
    transform:      translateY(-50%);
    color:          hsl(var(--muted-foreground));
    pointer-events: none;
    display:        flex;
}

.blog-search {
    width:            100%;
    padding:          .6875rem 1rem .6875rem 2.625rem;
    border:           1px solid rgb(209, 213, 219);
    border-radius:    .75rem;
    background:       white;
    font-size:        .875rem;
    color:            hsl(var(--foreground));
    outline:          none;
    transition:       border-color .15s, box-shadow .15s;
    -webkit-appearance: none;
    appearance:       none;
    box-sizing:       border-box;
}

.blog-search:focus {
    border-color: hsl(var(--primary));
    box-shadow:   0 0 0 3px hsl(var(--primary) / .12);
}

.blog-search::placeholder {
    color: hsl(var(--muted-foreground));
}

/* ✕ clear button */
.blog-search-clear {
    display:          inline-flex;
    align-items:      center;
    justify-content:  center;
    width:            1.875rem;
    height:           1.875rem;
    border-radius:    50%;
    background:       rgb(229, 231, 235);
    color:            hsl(var(--muted-foreground));
    font-size:        .75rem;
    line-height:      1;
    text-decoration:  none;
    transition:       background .15s, color .15s;
    flex-shrink:      0;
}

.blog-search-clear:hover {
    background: rgb(209, 213, 219);
    color:      hsl(var(--foreground));
}

/* ── Category filter pills ─────────────────────────────────────── */
.blog-filters {
    display:   flex;
    flex-wrap: wrap;
    gap:       .375rem;
}

.blog-filter {
    display:          inline-flex;
    align-items:      center;
    padding:          .3125rem .875rem;
    border-radius:    9999px;
    border:           1px solid rgb(209, 213, 219);
    background:       white;
    color:            hsl(var(--muted-foreground));
    font-size:        .8125rem;
    font-weight:      500;
    text-decoration:  none;
    white-space:      nowrap;
    transition:       all .15s;
    line-height:      1.5;
}

.blog-filter:hover {
    border-color: hsl(var(--primary));
    color:        hsl(var(--primary));
    background:   hsl(var(--primary) / .04);
    text-decoration: none;
}

.blog-filter.active {
    background:   hsl(var(--primary));
    border-color: hsl(var(--primary));
    color:        white;
}

.blog-filter.active:hover {
    background: hsl(var(--primary) / .9);
}

/* ── Category badge (inline, on cards and post pages) ─────────── */
.blog-cat-badge {
    display:          inline-flex;
    align-items:      center;
    padding:          .15em .6em;
    border-radius:    9999px;
    background:       hsl(var(--primary) / .1);
    color:            hsl(var(--primary));
    font-size:        .75rem;
    font-weight:      600;
    line-height:      1.5;
    text-decoration:  none;
    transition:       background .15s;
    white-space:      nowrap;
}

.blog-cat-badge:hover {
    background: hsl(var(--primary) / .18);
    text-decoration: none;
}

/* Larger variant for post page header */
.blog-cat-badge--lg {
    padding:   .3125rem .875rem;
    font-size: .8125rem;
}

/* ── Cover image on blog cards ─────────────────────────────────── */

/* Cards with cover image need overflow:hidden for border-radius */
.blog-card {
    overflow: hidden; /* allows cover image to fill top flush */
}

.blog-card-cover {
    display:     block;
    margin:      -1.5rem -1.5rem 1rem; /* bleed to card edges */
    aspect-ratio: 16 / 9;
    overflow:    hidden;
    flex-shrink: 0;
    background:  rgb(243, 244, 246);
    text-decoration: none;
}

.blog-card-cover img {
    width:      100%;
    height:     100%;
    object-fit: cover;
    display:    block;
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
}

.blog-card:hover .blog-card-cover img {
    transform: scale(1.04);
}

/* ── Cover image on blog post page ────────────────────────────── */
.blog-post-cover-wrap {
    background: white;
    padding-top: 1.5rem;
}

.blog-post-cover {
    aspect-ratio: 16 / 7;
    border-radius: .875rem;
    overflow: hidden;
    background: rgb(243, 244, 246);
}

.blog-post-cover img {
    width:      100%;
    height:     100%;
    object-fit: cover;
    display:    block;
}

/* ── Empty state ───────────────────────────────────────────────── */
.blog-empty {
    text-align:  center;
    padding:     4rem 1rem;
    color:       hsl(var(--muted-foreground));
}

.blog-empty p {
    margin-bottom: 1rem;
}

/* ── Mobile adjustments ────────────────────────────────────────── */
@media (max-width: 640px) {
    .blog-search-wrap { max-width: none; }
    .blog-post-cover { aspect-ratio: 16 / 9; }
}

/* §16c ── Featured Blog Section — homepage carousel ─────────────────────────
   Snap-scroll carousel of the latest published blog posts, positioned above
   the Google reviews section on the homepage (index.php).
   Only rendered when ≥1 published post exists.
   ────────────────────────────────────────────────────────────────────────── */

.featured-blog-section {
    padding:    5rem 0 4.5rem;
    background: #ffffff;
    /* No overflow:hidden here — the track is a self-contained scroll container
       (overflow-x:auto) so nothing escapes the viewport; adding overflow:hidden
       interacted badly with the negative-margin approach and clipped the left
       card padding, making the first card flush with the screen edge on mobile. */
}

/* ── Header row: badge + heading (left) · nav arrows + all-link (right) ── */
.fbs-header {
    display:         flex;
    align-items:     flex-end;
    justify-content: space-between;
    flex-wrap:       wrap;
    gap:             1rem;
    margin-bottom:   2.5rem;
}
.fbs-header-left {
    display:        flex;
    flex-direction: column;
    gap:            .75rem;
}
.fbs-badge {
    display:        inline-flex;
    align-items:    center;
    gap:            .4rem;
    font-size:      .7rem;
    font-weight:    700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color:          hsl(var(--primary));
    background:     hsl(var(--primary) / .08);
    border:         1px solid hsl(var(--primary) / .22);
    border-radius:  9999px;
    padding:        .28rem .875rem;
    width:          fit-content;
}
.fbs-badge svg { width: 14px; height: 14px; flex-shrink: 0; }

.fbs-heading {
    font-size:      clamp(1.75rem, 3vw, 2.5rem);
    font-weight:    800;
    letter-spacing: -.035em;
    line-height:    1.15;
    color:          hsl(var(--foreground));
    margin:         0;
}
.fbs-heading span { color: hsl(var(--primary)); }

.fbs-controls {
    display:       flex;
    align-items:   center;
    gap:           .75rem;
    flex-shrink:   0;
    padding-bottom: .25rem; /* visual alignment with heading baseline */
}
.fbs-btn {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:  2.25rem;
    height: 2.25rem;
    border:        1px solid hsl(var(--border));
    border-radius: 50%;
    background:    #fff;
    color:         hsl(var(--foreground));
    cursor:        pointer;
    transition:    background .15s, border-color .15s, color .15s;
    flex-shrink:   0;
}
.fbs-btn:hover          { background: hsl(var(--primary)); border-color: hsl(var(--primary)); color: #fff; }
.fbs-btn:disabled       { opacity: .4; cursor: not-allowed; }
.fbs-btn:disabled:hover { background: #fff; border-color: hsl(var(--border)); color: hsl(var(--foreground)); }

.fbs-all-link {
    display:         inline-flex;
    align-items:     center;
    gap:             .3rem;
    font-size:       .875rem;
    font-weight:     600;
    color:           hsl(var(--primary));
    text-decoration: none;
    white-space:     nowrap;
    transition:      gap .15s;
}
.fbs-all-link:hover { gap: .625rem; }

/* ── Snap-scroll track ─────────────────────────────────────────────────── */
/* Lives inside .page-container which already supplies the left/right padding
   (1.5 rem mobile → 2 rem desktop).  No negative margin needed — cards
   overflow to the right naturally (peek effect), and the track's own
   overflow-x:auto keeps everything within the viewport.                   */
.fbs-track {
    display:                  flex;
    gap:                      1.5rem;
    overflow-x:               auto;
    scroll-snap-type:         x mandatory;
    scroll-behavior:          smooth;
    -webkit-overflow-scrolling: touch;
    touch-action:    pan-x; /* horizontal drags scroll carousel; vertical drags scroll page */
    /* top/bottom padding only — horizontal spacing comes from .page-container */
    padding:         .5rem 0 1.25rem;
    scrollbar-width: none; /* Firefox */
}
.fbs-track::-webkit-scrollbar { display: none; }

/* ── Card ──────────────────────────────────────────────────────────────── */
.fbs-card {
    flex-shrink:     0;
    width:           290px;
    border:          1px solid var(--border-card, rgb(229,231,235));
    border-radius:   1rem;
    overflow:        hidden;
    background:      #fff;
    scroll-snap-align: start;
    display:         flex;
    flex-direction:  column;
    text-decoration: none;
    color:           inherit;
    transition:      box-shadow .2s, transform .2s;
}
.fbs-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,.09); transform: translateY(-2px); }

@media (min-width: 768px)  { .fbs-card { width: 300px; } }
@media (min-width: 1024px) { .fbs-card { width: 320px; } }

.fbs-card-img-wrap {
    width:      100%;
    height:     200px;
    overflow:   hidden;
    flex-shrink: 0;
}
.fbs-card-img {
    width:            100%;
    height:           100%;
    object-fit:       cover;
    object-position:  center;
    display:          block;
    transition:       transform .35s cubic-bezier(.25,.46,.45,.94);
}
.fbs-card:hover .fbs-card-img { transform: scale(1.05); }

/* Gradient placeholder for posts without a cover image */
.fbs-card-noimg {
    width:       100%;
    height:      100%;
    background:  linear-gradient(135deg,
                     hsl(var(--primary) / .1) 0%,
                     hsl(var(--primary) / .04) 100%);
    display:     flex;
    align-items: center;
    justify-content: center;
    color:       hsl(var(--primary) / .3);
}
.fbs-card-noimg svg { width: 2.5rem; height: 2.5rem; }

.fbs-card-body {
    padding:        1.125rem 1.25rem 1.375rem;
    display:        flex;
    flex-direction: column;
    flex:           1;
}
.fbs-card-meta {
    display:        flex;
    align-items:    center;
    gap:            .5rem;
    flex-wrap:      wrap;
    margin-bottom:  .75rem;
}
.fbs-card-cat {
    font-size:      .68rem;
    font-weight:    700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color:          hsl(var(--primary));
    background:     hsl(var(--primary) / .1);
    border-radius:  9999px;
    padding:        .2rem .6rem;
    white-space:    nowrap;
}
.fbs-card-date {
    font-size:   .8rem;
    color:       hsl(var(--muted-foreground));
    display:     inline-flex;
    align-items: center;
    gap:         .3rem;
    flex-shrink: 0;
}
.fbs-card-title {
    font-size:   1rem;
    font-weight: 700;
    line-height: 1.4;
    color:       hsl(var(--foreground));
    margin-bottom: .5rem;
    display:           -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp:         2;
    overflow:           hidden;
}
.fbs-card-excerpt {
    font-size:   .875rem;
    line-height: 1.6;
    color:       hsl(var(--muted-foreground));
    flex:        1;
    display:           -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp:         3;
    overflow:           hidden;
    margin-bottom: 1rem;
}
.fbs-card-readmore {
    display:         inline-flex;
    align-items:     center;
    gap:             .375rem;
    font-size:       .875rem;
    font-weight:     600;
    color:           hsl(var(--primary));
    text-decoration: none;
    margin-top:      auto;
    transition:      gap .15s;
}
.fbs-card-readmore:hover { gap: .625rem; }

/* §17 ── Kontakt ────────────────────────────────────────────────────────────
 * Replaces: grid md:grid-cols-2 gap-12 lg:gap-20 items-start
 * ────────────────────────────────────────────────────────────────────────── */

.contact-grid {
    display:     grid;
    gap:         2rem;    /* gap-12 */
    align-items: start;   /* items-start */
}

@media (min-width: 768px) {  /* md: */
    .contact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)); /* grid-cols-2 */
    }
}

@media (min-width: 1024px) { /* lg: */
    .contact-grid {
        gap: 5rem; /* lg:gap-20 */
    }
}

/*
 * Stacked list of contact info tiles (email, phone, address, hours).
 * Pure layout wrapper — tiles carry their own background/border.
 * Replaces: flex flex-col gap-3
 */
.contact-tiles {
    display:        flex;
    flex-direction: column;
    gap:            var(--space-3);   /* gap-3 — 0.75 rem */
}


/*
 * Icon wrapper inside each contact info tile.
 * Replaces: w-12 h-12 rounded-xl bg-primary/10 flex items-center
 *           justify-center shrink-0 group-hover:bg-primary/15 transition-colors
 */
.contact-tile-icon {
    width:            3rem;                          /* w-12 */
    height:           3rem;                          /* h-12 */
    border-radius:    var(--radius-md);              /* rounded-xl */
    background-color: hsl(var(--primary) / 0.10);
    display:          flex;
    align-items:      center;
    justify-content:  center;
    flex-shrink:      0;
    transition:       background-color 0.15s;
}

/* group-hover:bg-primary/15 — fires when the parent <a> tile is hovered */
a:hover .contact-tile-icon {
    background-color: hsl(var(--primary) / 0.15);
}

/*
 * Individual contact info tile (email, phone, address, hours).
 * Replaces: flex items-center gap-4 p-5 rounded-2xl bg-white border
 *           border-gray-100 hover:border-primary/30 hover:shadow-sm transition-all group
 */
.contact-tile {
    display:          flex;
    align-items:      center;
    gap:              var(--space-4);             /* gap-4 — 1 rem          */
    padding:          1.25rem;                    /* p-5                    */
    border-radius:    var(--radius-lg);           /* rounded-2xl — 1 rem    */
    background-color: var(--bg-card);                /* gray-50 — theme token  */
    border:           1px solid var(--border-card); /* unified gray-200     */
    transition:       all 0.15s;
    text-decoration:  none;
    color:            inherit;
}

.contact-tile:hover {
    border-color: hsl(var(--primary) / 0.30);
    box-shadow:   var(--shadow-card);             /* subtle elevation on hover */
}

/*
 * Generic white card used for form containers and info panels.
 * Replaces: bg-white rounded-2xl border border-gray-200 p-8 shadow-sm
 * Apply to the right-column contact form card and similar containers.
 */
.form-card {
    background-color: var(--bg-card);
    border-radius:    var(--radius-lg);
    border:           1px solid var(--border-card);
    padding:          var(--space-8);
    box-shadow:       var(--shadow-card);
}

/* ------------------------------------------------------------
   13. FAQ page — search · filter pills · accordion
   ------------------------------------------------------------ */

/* Section background */
.faq-section {
    background-color: #fff;
    padding-top:      3rem;
    padding-bottom:   5rem;
}

/* ── Search bar ─────────────────────────────────────────────── */

.faq-search-wrap {
    position:      relative;
    max-width:     28rem;
    margin-bottom: 1.5rem;
}

.faq-search-icon {
    position:       absolute;
    left:           0.875rem;
    top:            50%;
    transform:      translateY(-50%);
    color:          hsl(var(--muted-foreground));
    pointer-events: none;
}

.faq-search {
    width:            100%;
    padding:          0.75rem 1rem 0.75rem 2.75rem;
    border:           1px solid rgb(209, 213, 219); /* gray-300 */
    border-radius:    0.75rem;
    background-color: white;
    font-size:        0.875rem;
    color:            hsl(var(--foreground));
    outline:          none;
    transition:       border-color 0.15s, box-shadow 0.15s;
    -webkit-appearance: none;
    appearance:       none;
    box-sizing:       border-box;
}

.faq-search:focus {
    border-color: hsl(var(--primary));
    box-shadow:   0 0 0 3px hsl(var(--primary) / 0.12);
}

.faq-search::placeholder {
    color: hsl(var(--muted-foreground));
}

/* ── Filter pills ───────────────────────────────────────────── */

.faq-filters {
    display:       flex;
    flex-wrap:     wrap;
    gap:           0.5rem;
    margin-bottom: 2rem;
}

.faq-filter {
    padding:          0.375rem 1rem;
    border-radius:    9999px;
    border:           1px solid rgb(209, 213, 219);
    background-color: white;
    color:            hsl(var(--muted-foreground));
    font-size:        0.8125rem;
    font-weight:      500;
    cursor:           pointer;
    transition:       all 0.15s;
    line-height:      1.5;
}

.faq-filter:hover {
    border-color: hsl(var(--primary));
    color:        hsl(var(--primary));
    background:   hsl(var(--primary) / 0.04);
}

.faq-filter.active {
    background-color: hsl(var(--primary));
    border-color:     hsl(var(--primary));
    color:            white;
}

/* ── Accordion list ─────────────────────────────────────────── */

.faq-list {
    display:        flex;
    flex-direction: column;
    gap:            0.5rem;
}

/* Individual item card */
.faq-item {
    background-color: var(--bg-card);
    border:           1px solid var(--border-card);
    border-radius:    var(--radius-lg);             /* unified with blog-card, product-card */
    overflow:         hidden;
    transition:       box-shadow 0.15s, border-color 0.15s;
}

.faq-item:hover {
    box-shadow: var(--shadow-hover);
}

.faq-item.open {
    border-color: hsl(var(--primary) / 0.35);
    box-shadow:   0 2px 14px hsl(var(--primary) / 0.09);
}

/* Question button row */
.faq-question {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    width:           100%;
    padding:         1.125rem 1.5rem;
    background:      none;
    border:          none;
    cursor:          pointer;
    text-align:      left;
    gap:             1rem;
    color:           hsl(var(--foreground));
    font-size:       0.875rem;
    font-weight:     500;
    line-height:     1.4;
    transition:      color 0.15s;
}

.faq-item.open .faq-question {
    color: hsl(var(--primary));
}

/* Rotating chevron */
.faq-chevron {
    flex-shrink: 0;
    width:       1.125rem;
    height:      1.125rem;
    color:       hsl(var(--muted-foreground));
    transition:  transform 0.25s cubic-bezier(.4, 0, .2, 1), color 0.15s;
}

.faq-item.open .faq-chevron {
    transform: rotate(180deg);
    color:     hsl(var(--primary));
}

/* Collapsible answer panel */
.faq-answer {
    max-height: 0;
    overflow:   hidden;
    transition: max-height 0.32s cubic-bezier(.4, 0, .2, 1);
}

.faq-item.open .faq-answer {
    max-height: 600px;
}

.faq-answer-inner {
    padding:     0 1.5rem 1.25rem;
    color:       hsl(var(--muted-foreground));
    font-size:   0.8125rem;
    line-height: 1.65;
    border-top:  1px solid rgb(243, 244, 246);
    padding-top: 1rem;
}

.faq-answer-inner strong {
    font-weight: 600;
    color:       hsl(var(--foreground));
}

/* Empty state */
.faq-empty {
    text-align:  center;
    padding:     3rem 1rem;
    color:       hsl(var(--muted-foreground));
    font-size:   0.875rem;
    line-height: 1.6;
}


/* §18 ── Chatbot widget ─────────────────────────────────────────────────────
   Floating navigation assistant — bottom-right corner, rule-based responses.
   HTML lives in footer.php; JS is inline in footer.php.
   ─────────────────────────────────────────────────────────────────────────── */

/* ── Toggle button ─────────────────────────────────────────────── */
#chat-btn {
    position:        fixed;
    bottom:          1.5rem;
    right:           1.5rem;
    z-index:         195;
    width:           3.5rem;
    height:          3.5rem;
    border-radius:   50%;
    background:      hsl(var(--primary));
    color:           white;
    border:          none;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    box-shadow:      0 4px 20px hsl(var(--primary) / 0.42);
    transition:      transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1),
                     box-shadow 0.2s;
    -webkit-tap-highlight-color: transparent;
}

#chat-btn:hover {
    transform:  scale(1.1);
    box-shadow: 0 6px 28px hsl(var(--primary) / 0.52);
}

/* ── Chat panel ────────────────────────────────────────────────── */
#chat-window {
    position:       fixed;
    bottom:         calc(3.5rem + 1.5rem + 0.875rem); /* above button + gap */
    right:          1.5rem;
    z-index:        195;
    width:          22rem;          /* 352 px */
    max-height:     34rem;
    border-radius:  1rem;
    background:     white;
    border:         1px solid rgb(229, 231, 235);
    box-shadow:     0 8px 40px rgba(0, 0, 0, 0.14),
                    0 2px 8px rgba(0, 0, 0, 0.06);
    display:        flex;
    flex-direction: column;
    overflow:       hidden;
    /* Slide-up + scale spring animation */
    transform-origin: bottom right;
    transform:      scale(0.9) translateY(12px);
    opacity:        0;
    pointer-events: none;
    transition:     transform 0.26s cubic-bezier(0.34, 1.56, 0.64, 1),
                    opacity   0.18s;
}

#chat-window.open {
    transform:      scale(1) translateY(0);
    opacity:        1;
    pointer-events: auto;
}

/* ── Panel header ──────────────────────────────────────────────── */
#chat-header {
    background:      hsl(var(--primary));
    color:           white;
    padding:         0.875rem 1rem;
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    flex-shrink:     0;
    gap:             0.75rem;
}

.chat-hdr-info {
    display:     flex;
    align-items: center;
    gap:         0.625rem;
}

.chat-hdr-avatar {
    width:           2.125rem;
    height:          2.125rem;
    border-radius:   50%;
    background:      rgba(255, 255, 255, 0.2);
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
}

.chat-hdr-name {
    font-weight: 700;
    font-size:   0.9375rem;
    line-height: 1.2;
}

.chat-hdr-sub {
    font-size:  0.6875rem;
    opacity:    0.78;
    margin-top: 0.1em;
}

.chat-hdr-actions {
    display:     flex;
    align-items: center;
    gap:         0.375rem;
    flex-shrink: 0;
}

.chat-hdr-btn {
    width:           1.875rem;
    height:          1.875rem;
    border-radius:   50%;
    background:      rgba(255, 255, 255, 0.18);
    color:           white;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    text-decoration: none;
    transition:      background 0.15s;
    flex-shrink:     0;
}

.chat-hdr-btn:hover { background: rgba(255, 255, 255, 0.32); }

/* ── Messages area ─────────────────────────────────────────────── */
#chat-messages {
    flex:             1;
    overflow-y:       auto;
    padding:          1rem;
    display:          flex;
    flex-direction:   column;
    gap:              0.625rem;
    scroll-behavior:  smooth;
    overscroll-behavior: contain;
}

/* Message bubble */
.chat-msg {
    max-width:    85%;
    padding:      0.5625rem 0.875rem;
    border-radius: 1rem;
    font-size:    0.875rem;
    line-height:  1.55;
    word-break:   break-word;
}

.chat-msg-bot {
    align-self:              flex-start;
    background:              rgb(243, 244, 246);
    color:                   hsl(var(--foreground));
    border-bottom-left-radius: 0.25rem;
}

.chat-msg-user {
    align-self:               flex-end;
    background:               hsl(var(--primary));
    color:                    white;
    border-bottom-right-radius: 0.25rem;
}

/* Link buttons inside bot messages */
.chat-links {
    display:       flex;
    flex-direction: column;
    gap:           0.375rem;
    margin-top:    0.625rem;
}

.chat-link {
    display:         inline-flex;
    align-items:     center;
    padding:         0.375rem 0.875rem;
    background:      white;
    border:          1px solid hsl(var(--primary) / 0.3);
    border-radius:   0.5rem;
    color:           hsl(var(--primary));
    font-size:       0.8125rem;
    font-weight:     600;
    text-decoration: none;
    transition:      background 0.15s, border-color 0.15s;
    line-height:     1.4;
}

.chat-link:hover {
    background:      hsl(var(--primary) / 0.07);
    border-color:    hsl(var(--primary));
    text-decoration: none;
}

/* ── Typing indicator ──────────────────────────────────────────── */
.chat-typing {
    display:     flex;
    align-items: center;
    gap:         0.3125rem;
    padding:     0.75rem 1rem !important;
    min-width:   3.5rem;
}

.chat-typing span {
    display:       block;
    width:         0.375rem;
    height:        0.375rem;
    border-radius: 50%;
    background:    hsl(var(--muted-foreground));
    animation:     chat-dot 1.2s ease-in-out infinite;
    opacity:       0.5;
}

.chat-typing span:nth-child(2) { animation-delay: 0.18s; }
.chat-typing span:nth-child(3) { animation-delay: 0.36s; }

@keyframes chat-dot {
    0%, 60%, 100% { transform: translateY(0);     opacity: 0.4; }
    30%           { transform: translateY(-5px);   opacity: 1; }
}

/* ── Quick chips ───────────────────────────────────────────────── */
#chat-chips {
    padding:        0.5rem 0.75rem 0.625rem;
    display:        flex;
    flex-wrap:      wrap;
    gap:            0.375rem;
    border-top:     1px solid rgb(243, 244, 246);
    flex-shrink:    0;
    background:     rgb(250, 250, 250);
}

#chat-chips:empty { display: none; }

.chat-chip {
    padding:       0.3rem 0.75rem;
    border-radius: 9999px;
    border:        1px solid rgb(209, 213, 219);
    background:    white;
    font-size:     0.8rem;
    font-weight:   500;
    color:         hsl(var(--foreground));
    cursor:        pointer;
    transition:    all 0.15s;
    white-space:   nowrap;
    font-family:   inherit;
    line-height:   1.5;
}

.chat-chip:hover {
    border-color: hsl(var(--primary));
    color:        hsl(var(--primary));
    background:   hsl(var(--primary) / 0.05);
}

/* ── Input row ─────────────────────────────────────────────────── */
#chat-input-row {
    display:     flex;
    gap:         0.5rem;
    padding:     0.625rem 0.75rem;
    border-top:  1px solid rgb(229, 231, 235);
    flex-shrink: 0;
    background:  white;
}

#chat-input {
    flex:        1;
    padding:     0.5rem 0.875rem;
    border:      1px solid rgb(209, 213, 219);
    border-radius: 0.625rem;
    font-size:   0.875rem;
    color:       hsl(var(--foreground));
    outline:     none;
    transition:  border-color 0.15s, box-shadow 0.15s;
    font-family: inherit;
    -webkit-appearance: none;
    appearance:  none;
    background:  white;
}

#chat-input:focus {
    border-color: hsl(var(--primary));
    box-shadow:   0 0 0 3px hsl(var(--primary) / 0.1);
}

#chat-input::placeholder { color: hsl(var(--muted-foreground)); }

#chat-send {
    width:           2.25rem;
    height:          2.25rem;
    border-radius:   0.625rem;
    background:      hsl(var(--primary));
    color:           white;
    border:          none;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    transition:      background 0.15s, transform 0.1s;
}

#chat-send:hover  { background: hsl(var(--primary) / 0.88); }
#chat-send:active { transform: scale(0.92); }

/* ── Mobile adjustments ────────────────────────────────────────── */
@media (max-width: 480px) {
    #chat-btn    { right: 1rem; bottom: 1rem; }
    #chat-window {
        width:  calc(100vw - 2rem);
        right:  1rem;
        bottom: calc(3.5rem + 1rem + 0.875rem);
        max-height: 75dvh;
    }
}

/* ── Tablet / small-desktop: raise button 20 px higher ────────── */
@media (min-width: 640px) and (max-width: 1279px) {
    #chat-btn { bottom: calc(1.5rem + 20px); }
}


/* ------------------------------------------------------------
   19. Accessibility utilities
   ------------------------------------------------------------ */

/* Screen-reader-only text — visually hidden but accessible */
.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;
}


/* ------------------------------------------------------------
   20. Sonner toast notification styles (moved from inline <style>)
   ------------------------------------------------------------ */

[data-sonner-toast]:focus-visible {
    box-shadow: 0 4px 12px rgba(0,0,0,.1), 0 0 0 2px rgba(0,0,0,.2);
}
[data-sonner-toast][data-styled=true] [data-button]:focus-visible {
    box-shadow: 0 0 0 2px rgba(0,0,0,.4);
}
[data-sonner-toast][data-styled=true] [data-close-button]:focus-visible {
    box-shadow: 0 4px 12px rgba(0,0,0,.1), 0 0 0 2px rgba(0,0,0,.2);
}
[data-sonner-toast][data-styled=true]:hover [data-close-button]:hover {
    background: var(--gray2);
    border-color: var(--gray5);
}
[data-sonner-toast][data-swiping=true]::before {
    content: "";
    position: absolute;
    left: -100%;
    right: -100%;
    height: 100%;
    z-index: -1;
}
[data-sonner-toast][data-y-position=top][data-swiping=true]::before {
    bottom: 50%;
    transform: scaleY(3) translateY(50%);
}
[data-sonner-toast][data-y-position=bottom][data-swiping=true]::before {
    top: 50%;
    transform: scaleY(3) translateY(-50%);
}
[data-sonner-toast][data-swiping=false][data-removed=true]::before {
    content: "";
    position: absolute;
    inset: 0;
    transform: scaleY(2);
}
[data-sonner-toast][data-expanded=true]::after {
    content: "";
    position: absolute;
    left: 0;
    height: calc(var(--gap) + 1px);
    bottom: 100%;
    width: 100%;
}
[data-sonner-toast][data-removed=true][data-front=false]::before {
    height: calc(var(--initial-height) + 20%);
}
[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover {
    background: var(--normal-bg-hover);
    border-color: var(--normal-border-hover);
}

@keyframes swipe-out-left {
    from { transform: var(--y) translateX(var(--swipe-amount-x)); opacity: 1; }
    to   { transform: var(--y) translateX(calc(var(--swipe-amount-x) - 100%)); opacity: 0; }
}
@keyframes swipe-out-right {
    from { transform: var(--y) translateX(var(--swipe-amount-x)); opacity: 1; }
    to   { transform: var(--y) translateX(calc(var(--swipe-amount-x) + 100%)); opacity: 0; }
}
@keyframes swipe-out-up {
    from { transform: var(--y) translateY(var(--swipe-amount-y)); opacity: 1; }
    to   { transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%)); opacity: 0; }
}
@keyframes swipe-out-down {
    from { transform: var(--y) translateY(var(--swipe-amount-y)); opacity: 1; }
    to   { transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%)); opacity: 0; }
}
@keyframes sonner-fade-in {
    0%   { opacity: 0; transform: scale(.8); }
    100% { opacity: 1; transform: scale(1); }
}
@keyframes sonner-fade-out {
    0%   { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: scale(.8); }
}
@keyframes sonner-spin {
    0%   { opacity: 1; }
    100% { opacity: .15; }
}

/* sf-hidden utility (moved from inline <style>) */
.sf-hidden { display: none !important; }


/* ============================================================
   §21 — Sprint #1: Micro-interactions
   micro-interactions.js drives the JS side; CSS lives here.
   All animation blocks are paired with a
   @media (prefers-reduced-motion: reduce) disable rule.
   ============================================================ */


/* ── 1. FLOATING LABELS ──────────────────────────────────────────────
   .pi-float-group wraps <label> + <input|textarea>.
   Label is absolute-positioned and animates from inside the field
   (default) to above the top border (focused / has-value state).
   ──────────────────────────────────────────────────────────────────── */

.pi-float-group {
    position: relative;
    /* spacing provided by the outer .mb-5 / .mb-6 wrapper */
}

/* Label — sits inside the field by default */
.pi-float-group label {
    position:       absolute;
    left:           1rem;
    top:            50%;
    transform:      translateY(-50%);
    font-size:      0.875rem;
    font-weight:    500;
    color:          hsl(var(--muted-foreground));
    pointer-events: none;
    background:     #ffffff;
    padding:        0 0.25rem;
    line-height:    1.2;
    margin:         0;
    z-index:        1;
    white-space:    nowrap;
    max-width:      calc(100% - 3.5rem);
    overflow:       hidden;
    text-overflow:  ellipsis;
    /* Transition: 200ms, exact cubic-bezier as specified */
    transition:     top      200ms cubic-bezier(0.4, 0, 0.2, 1),
                    transform 200ms cubic-bezier(0.4, 0, 0.2, 1),
                    font-size 200ms cubic-bezier(0.4, 0, 0.2, 1),
                    color     200ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Textarea: label anchored to top, not vertically centred */
.pi-float-group.is-textarea label {
    top:       0.9375rem;
    transform: none;
}

/* ── Floated state: focused OR has a value ── */
.pi-float-group.fl-active label,
.pi-float-group.fl-filled label {
    top:       0;
    transform: translateY(-50%) scale(0.85);
    color:     hsl(var(--primary));
    font-weight: 600;
}

.pi-float-group.is-textarea.fl-active label,
.pi-float-group.is-textarea.fl-filled label {
    top:       0;
    transform: translateY(-50%);
    font-size: 0.75rem;
    color:     hsl(var(--primary));
    font-weight: 600;
}

/* ── Input / textarea padding adjustment ── */
/* Adds top room for the floating label; total vertical padding unchanged */
.pi-float-group input,
.pi-float-group textarea {
    padding-top:    1.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-right:  2.5rem  !important; /* room for the valid-icon */
}

/* ── Hide placeholder until field is focused (label acts as placeholder) ── */
.pi-float-group input::placeholder,
.pi-float-group textarea::placeholder {
    opacity:    0;
    transition: opacity 150ms ease;
}
.pi-float-group.fl-active input::placeholder,
.pi-float-group.fl-active textarea::placeholder {
    opacity: 0.55;
}

/* ── Validation colour overrides for the label ── */
.pi-float-group.field-invalid.fl-active label,
.pi-float-group.field-invalid.fl-filled label {
    color: #ef4444;
}
.pi-float-group.field-valid.fl-active label,
.pi-float-group.field-valid.fl-filled label {
    color: #22c55e;
}

/* Reduced motion: instant label position (no animation) */
@media (prefers-reduced-motion: reduce) {
    .pi-float-group label {
        transition: none;
    }
    .pi-float-group input::placeholder,
    .pi-float-group textarea::placeholder {
        transition: none;
    }
}


/* ── 2. INLINE VALIDATION ────────────────────────────────────────────
   Green checkmark icon and red error message injected by JS.
   ──────────────────────────────────────────────────────────────────── */

/* Checkmark icon — hidden by default, spring-scales in on valid */
.pi-valid-icon {
    position:       absolute;
    right:          0.75rem;
    top:            50%;
    transform:      translateY(-50%) scale(0);
    opacity:        0;
    color:          #22c55e;
    pointer-events: none;
    display:        flex;
    align-items:    center;
    transition:     transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1),
                    opacity   150ms ease;
}

/* Textarea: pin to top instead of vertically centred */
.pi-float-group.is-textarea .pi-valid-icon {
    top:       1.375rem;
    transform: translateY(0) scale(0);
}

/* Visible state */
.pi-float-group.field-valid .pi-valid-icon {
    transform: translateY(-50%) scale(1);
    opacity:   1;
}
.pi-float-group.is-textarea.field-valid .pi-valid-icon {
    transform: translateY(0) scale(1);
    opacity:   1;
}

/* Error message paragraph */
.pi-field-error {
    font-size:   0.75rem;
    color:       #ef4444;
    margin-top:  0.3125rem;
    line-height: 1.4;
    /* display:none set inline by JS; listed here for documentation */
}

/* Shake animation — fired by JS adding .pi-shake for 320ms */
@keyframes pi-shake {
    0%,100% { transform: translateX(0);    }
    20%     { transform: translateX(-6px); }
    40%     { transform: translateX( 6px); }
    60%     { transform: translateX(-4px); }
    80%     { transform: translateX( 4px); }
}
.pi-shake {
    animation: pi-shake 300ms cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}

@media (prefers-reduced-motion: reduce) {
    .pi-valid-icon { transition: none; }
    .pi-shake      { animation:  none; }
}


/* ── 3. INSURANCE CARD HOVER LIFT + CTA BUTTON PRESS ────────────────
   .pi-product-card — lift + deeper shadow on hover (300ms)
   .pi-cta-btn      — scale(0.97) on active/press (100ms)
   ──────────────────────────────────────────────────────────────────── */

.pi-product-card {
    transition: transform   300ms cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow  300ms cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.pi-product-card:hover {
    transform:  translateY(-4px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .12),
                0  4px 12px rgba(0, 0, 0, .07);
}

/* CTA button press */
.pi-cta-btn:active,
.pi-cta-btn.pi-btn-pressing {
    transform:  scale(0.97);
    transition: transform 100ms ease;
}

@media (prefers-reduced-motion: reduce) {
    .pi-product-card           { transition: none; will-change: auto; }
    .pi-product-card:hover     { transform: none; box-shadow: none; }
    .pi-cta-btn:active,
    .pi-cta-btn.pi-btn-pressing { transform: none; }
}


/* ── 4. SKELETON SCREEN ──────────────────────────────────────────────
   Overlay on #poistenieonline during calculator tab switches.
   Shimmer moves left → right continuously.
   ──────────────────────────────────────────────────────────────────── */

@keyframes pi-shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

.pi-skel-overlay {
    position:        absolute;
    inset:           0;
    z-index:         5;
    background:      rgb(20, 27, 38); /* matches surrounding bg-gray-900 */
    display:         flex;
    align-items:     center;
    justify-content: center;
    /* Hidden by default */
    opacity:         0;
    pointer-events:  none;
    transition:      opacity 180ms ease;
}

.pi-skel-overlay.pi-skel-visible {
    opacity:        1;
    pointer-events: auto;
}

.pi-skel-content {
    display:        flex;
    flex-direction: column;
    gap:            0.875rem;
    width:          72%;
    max-width:      520px;
}

.pi-skel-line {
    border-radius: 0.375rem;
    background:    linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.07)  0%,
        rgba(255, 255, 255, 0.16) 50%,
        rgba(255, 255, 255, 0.07) 100%
    );
    background-size: 200% 100%;
    animation: pi-shimmer 1.5s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
    .pi-skel-line {
        animation:  none;
        background: rgba(255, 255, 255, 0.09);
    }
    .pi-skel-overlay { transition: none; }
}


/* ── 5. PROGRESS BAR — calculator tab indicator ─────────────────────
   Thin 3px bar below the tab strip; width animates (400ms ease-out)
   from the first tab (1/6 ≈ 17%) to the last (6/6 = 100%).
   ──────────────────────────────────────────────────────────────────── */

.pi-progress-wrap {
    height:        3px;
    background:    rgba(255, 255, 255, 0.08);
    border-radius: 9999px;
    overflow:      hidden;
    margin-bottom: 0;
}

.pi-progress-bar {
    height:        100%;
    background:    hsl(var(--primary));
    border-radius: 9999px;
    transition:    width 400ms cubic-bezier(0.33, 1, 0.68, 1);
    width:         0%;
}

@media (prefers-reduced-motion: reduce) {
    .pi-progress-bar { transition: none; }
}