/*! tailwindcss v4.3.1 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-dot-navy:#0a1a2e}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}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;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-0{inset:0}.-top-3{top:calc(var(--spacing) * -3)}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.left-0{left:0}.left-1\/2{left:50%}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-14{margin-top:calc(var(--spacing) * 14)}.mt-16{margin-top:calc(var(--spacing) * 16)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.h-1{height:var(--spacing)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-full{height:100%}.h-px{height:1px}.w-1{width:var(--spacing)}.w-1\.5{width:calc(var(--spacing) * 1.5)}.w-2{width:calc(var(--spacing) * 2)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-48{width:calc(var(--spacing) * 48)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-lg{max-width:var(--container-lg)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.animate-pulse{animation:var(--animate-pulse)}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-10{gap:calc(var(--spacing) * 10)}.gap-12{gap:calc(var(--spacing) * 12)}.gap-14{gap:calc(var(--spacing) * 14)}.gap-16{gap:calc(var(--spacing) * 16)}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-\[\#2DD4D4\]{border-color:#2dd4d4}.border-\[\#2DD4D4\]\/40{border-color:oklab(79.1328% -.123159 -.0327376/.4)}.border-white\/5{border-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.border-white\/5{border-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.border-white\/12{border-color:#ffffff1f}@supports (color:color-mix(in lab, red, red)){.border-white\/12{border-color:color-mix(in oklab, var(--color-white) 12%, transparent)}}.bg-\[\#2DD4D4\]{background-color:#2dd4d4}.bg-\[\#2DD4D4\]\/10{background-color:oklab(79.1328% -.123159 -.0327376/.1)}.bg-\[\#2DD4D4\]\/15{background-color:oklab(79.1328% -.123159 -.0327376/.15)}.bg-\[\#050d1a\]{background-color:#050d1a}.bg-dot-navy{background-color:var(--color-dot-navy)}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.bg-white\/5{background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.bg-white\/10{background-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.bg-white\/40{background-color:#fff6}@supports (color:color-mix(in lab, red, red)){.bg-white\/40{background-color:color-mix(in oklab, var(--color-white) 40%, transparent)}}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-7{padding:calc(var(--spacing) * 7)}.p-8{padding:calc(var(--spacing) * 8)}.p-10{padding:calc(var(--spacing) * 10)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:var(--spacing)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-14{padding-block:calc(var(--spacing) * 14)}.py-24{padding-block:calc(var(--spacing) * 24)}.py-28{padding-block:calc(var(--spacing) * 28)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-20{padding-top:calc(var(--spacing) * 20)}.pt-28{padding-top:calc(var(--spacing) * 28)}.pt-36{padding-top:calc(var(--spacing) * 36)}.pb-10{padding-bottom:calc(var(--spacing) * 10)}.pb-16{padding-bottom:calc(var(--spacing) * 16)}.pb-28{padding-bottom:calc(var(--spacing) * 28)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-serif{font-family:var(--font-serif)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-\[1\.1\]{--tw-leading:1.1;line-height:1.1}.leading-\[1\.05\]{--tw-leading:1.05;line-height:1.05}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[0\.2em\]{--tw-tracking:.2em;letter-spacing:.2em}.tracking-\[0\.25em\]{--tw-tracking:.25em;letter-spacing:.25em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.text-balance{text-wrap:balance}.whitespace-nowrap{white-space:nowrap}.text-\[\#0a1a2e\]{color:#0a1a2e}.text-\[\#0a1a2e\]\/60{color:oklab(21.5703% -.0117156 -.0437034/.6)}.text-\[\#0a1a2e\]\/65{color:oklab(21.5703% -.0117156 -.0437034/.65)}.text-\[\#0a1a2e\]\/70{color:oklab(21.5703% -.0117156 -.0437034/.7)}.text-\[\#0a1a2e\]\/85{color:oklab(21.5703% -.0117156 -.0437034/.85)}.text-\[\#0e9f9f\]{color:#0e9f9f}.text-\[\#38f0f0\]{color:#38f0f0}.text-\[\#042024\]{color:#042024}.text-white{color:var(--color-white)}.text-white\/15{color:#ffffff26}@supports (color:color-mix(in lab, red, red)){.text-white\/15{color:color-mix(in oklab, var(--color-white) 15%, transparent)}}.text-white\/35{color:#ffffff59}@supports (color:color-mix(in lab, red, red)){.text-white\/35{color:color-mix(in oklab, var(--color-white) 35%, transparent)}}.text-white\/40{color:#fff6}@supports (color:color-mix(in lab, red, red)){.text-white\/40{color:color-mix(in oklab, var(--color-white) 40%, transparent)}}.text-white\/45{color:#ffffff73}@supports (color:color-mix(in lab, red, red)){.text-white\/45{color:color-mix(in oklab, var(--color-white) 45%, transparent)}}.text-white\/50{color:#ffffff80}@supports (color:color-mix(in lab, red, red)){.text-white\/50{color:color-mix(in oklab, var(--color-white) 50%, transparent)}}.text-white\/55{color:#ffffff8c}@supports (color:color-mix(in lab, red, red)){.text-white\/55{color:color-mix(in oklab, var(--color-white) 55%, transparent)}}.text-white\/60{color:#fff9}@supports (color:color-mix(in lab, red, red)){.text-white\/60{color:color-mix(in oklab, var(--color-white) 60%, transparent)}}.text-white\/65{color:#ffffffa6}@supports (color:color-mix(in lab, red, red)){.text-white\/65{color:color-mix(in oklab, var(--color-white) 65%, transparent)}}.text-white\/70{color:#ffffffb3}@supports (color:color-mix(in lab, red, red)){.text-white\/70{color:color-mix(in oklab, var(--color-white) 70%, transparent)}}.text-white\/75{color:#ffffffbf}@supports (color:color-mix(in lab, red, red)){.text-white\/75{color:color-mix(in oklab, var(--color-white) 75%, transparent)}}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab, red, red)){.text-white\/80{color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.text-white\/85{color:#ffffffd9}@supports (color:color-mix(in lab, red, red)){.text-white\/85{color:color-mix(in oklab, var(--color-white) 85%, transparent)}}.uppercase{text-transform:uppercase}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-500{--tw-duration:.5s;transition-duration:.5s}@media (hover:hover){.hover\:gap-3:hover{gap:calc(var(--spacing) * 3)}.hover\:text-\[\#38f0f0\]:hover{color:#38f0f0}.hover\:text-white:hover{color:var(--color-white)}.hover\:text-white\/60:hover{color:#fff9}@supports (color:color-mix(in lab, red, red)){.hover\:text-white\/60:hover{color:color-mix(in oklab, var(--color-white) 60%, transparent)}}.hover\:underline:hover{text-decoration-line:underline}}@media (min-width:48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:p-9{padding:calc(var(--spacing) * 9)}.md\:p-12{padding:calc(var(--spacing) * 12)}.md\:p-14{padding:calc(var(--spacing) * 14)}.md\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.md\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.md\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}}@media (min-width:64rem){.lg\:-mr-16{margin-right:calc(var(--spacing) * -16)}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:grid-cols-\[44\%_1fr\]{grid-template-columns:44% 1fr}.lg\:gap-20{gap:calc(var(--spacing) * 20)}.lg\:pt-36{padding-top:calc(var(--spacing) * 36)}.lg\:pb-28{padding-bottom:calc(var(--spacing) * 28)}.lg\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.lg\:text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}/* ============================================================
   Dotline — Liquid Design System
   Port 1:1 dal React → vanilla CSS. Funziona con Tailwind CDN.
   ============================================================ */

:root {
    --dot-navy-950: #050d1a;
    --dot-navy-900: #0a1a2e;
    --dot-navy-800: #0d2340;
    --dot-navy-700: #102a4d;
    --dot-cyan: #2DD4D4;
    --dot-cyan-bright: #38f0f0;
    --dot-cyan-soft: #7bf0f0;
    --dot-light: #eef6fb;
    --dot-light-2: #f5fafc;
    /* === Tema chiaro === */
    --ink: #0a1a2e;
    --ink-soft: rgba(10,26,46,.70);
    --ink-faint: rgba(10,26,46,.55);
    --accent: #0e9f9f;        /* teal leggibile su chiaro (sostituisce #38f0f0) */
    --accent-deep: #0891b2;
    --line: rgba(10,26,46,.10);
}

* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    scroll-padding-top: 90px;
}

body {
    margin: 0;
    font-family: 'Sora', -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: linear-gradient(180deg, #FBFDFF 0%, #EFF6FB 100%);
    background-attachment: fixed;
    color: var(--ink);
    overflow-x: hidden;
}

.font-serif {
    font-family: 'Instrument Serif', serif;
    font-style: italic;
    letter-spacing: -0.01em;
}

/* ====== Liquid Glass (tema chiaro) ====== */
.liquid-glass {
    background: linear-gradient(135deg, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0.55) 100%);
    backdrop-filter: blur(22px) saturate(170%);
    -webkit-backdrop-filter: blur(22px) saturate(170%);
    border: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95),
        inset 0 -1px 0 rgba(10, 26, 46, 0.04),
        0 24px 60px -24px rgba(10, 26, 46, 0.22),
        0 4px 14px -8px rgba(10, 26, 46, 0.10);
}

.liquid-glass-light {
    background: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border: 1px solid rgba(255, 255, 255, 0.85);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 10px 40px -10px rgba(10, 26, 46, 0.12);
}

.liquid-glass-dark {
    background: linear-gradient(135deg, rgba(45, 212, 212, 0.08) 0%, rgba(10, 26, 46, 0.5) 100%);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(45, 212, 212, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 20px 50px -20px rgba(0, 0, 0, 0.6);
}

/* ====== Liquid Metal Button ====== */
.btn-liquid-metal {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.9rem 1.8rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: 0.95rem;
    letter-spacing: -0.01em;
    color: #042024;
    text-decoration: none;
    background: linear-gradient(135deg, #b3fcfc 0%, #2DD4D4 35%, #38f0f0 65%, #c4fcfc 100%);
    background-size: 200% 200%;
    animation: metalShimmer 6s ease-in-out infinite;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        inset 0 -2px 4px rgba(0, 60, 70, 0.25),
        0 8px 24px -6px rgba(45, 212, 212, 0.5),
        0 0 0 1px rgba(45, 212, 212, 0.4);
    transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s cubic-bezier(.22,1,.36,1);
    overflow: hidden;
    border: none;
    cursor: pointer;
}
.btn-liquid-metal::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.6) 50%, transparent 70%);
    transform: translateX(-100%);
    transition: transform .8s ease;
}
.btn-liquid-metal:hover { transform: translateY(-2px) scale(1.02); }
.btn-liquid-metal:hover::before { transform: translateX(100%); }
.btn-liquid-metal:disabled { opacity: .6; cursor: not-allowed; }

@keyframes metalShimmer {
    0%,100% { background-position: 0% 50%; }
    50%     { background-position: 100% 50%; }
}

.btn-ghost-glass {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.7rem;
    border-radius: 999px;
    font-weight: 600;
    color: var(--ink);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--line);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 6px 18px -10px rgba(10,26,46,.18);
    transition: all 0.3s cubic-bezier(.22,1,.36,1);
    cursor: pointer;
}
.btn-ghost-glass:hover {
    background: #ffffff;
    border-color: rgba(45, 212, 212, 0.6);
    color: var(--accent-deep);
    transform: translateY(-2px);
}

/* ====== Blob morphing background ====== */
.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.55;
    pointer-events: none;
    animation: blobMorph 22s ease-in-out infinite;
}
.blob-cyan { background: radial-gradient(circle at 30% 30%, #2DD4D4, transparent 70%); }
.blob-deep { background: radial-gradient(circle at 50% 50%, #1e6a9c, transparent 70%); }
.blob-aqua { background: radial-gradient(circle at 60% 40%, #38f0f0, transparent 70%); }

@keyframes blobMorph {
    0%,100% {
        border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
        transform: translate(0,0) rotate(0deg) scale(1);
    }
    33% {
        border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
        transform: translate(40px,-30px) rotate(60deg) scale(1.08);
    }
    66% {
        border-radius: 50% 50% 40% 60% / 40% 50% 50% 60%;
        transform: translate(-30px,30px) rotate(-30deg) scale(.95);
    }
}

/* ====== Grain texture ====== */
.grain { position: relative; }
.grain::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.06;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.85'/></svg>");
}

/* ====== Liquid text effect ====== */
.liquid-text {
    background: linear-gradient(110deg, #0e9f9f 0%, #06B6D4 30%, #0891b2 50%, #06B6D4 70%, #0e9f9f 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: liquidFlow 8s linear infinite;
}
@keyframes liquidFlow {
    0%   { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* ====== Section meshes (semitrasparenti: lasciano vedere lo sfondo liquido) ====== */
.bg-navy-mesh {
    background:
        radial-gradient(ellipse 80% 50% at 20% 0%, rgba(45,212,212,.06), transparent 60%),
        linear-gradient(180deg, rgba(244,251,253,.62) 0%, rgba(255,255,255,.42) 100%);
}
.bg-light-mesh {
    background:
        linear-gradient(180deg, rgba(255,255,255,.50) 0%, rgba(238,246,251,.40) 100%);
}

/* ====== Liquid inputs ====== */
.liquid-input {
    width: 100%;
    padding: .9rem 1.1rem;
    background: rgba(255,255,255,.05);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    color: white;
    font-family: inherit;
    font-size: .95rem;
    transition: all .25s ease;
}
.liquid-input::placeholder { color: rgba(255,255,255,.4); }
.liquid-input:focus {
    outline: none;
    border-color: var(--dot-cyan);
    background: rgba(255,255,255,.08);
    box-shadow: 0 0 0 4px rgba(45,212,212,.15);
}
.liquid-input-light {
    width: 100%;
    padding: .9rem 1.1rem;
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(10,26,46,.12);
    border-radius: 14px;
    color: #0a1a2e;
    font-family: inherit;
    font-size: .95rem;
    transition: all .25s ease;
}
.liquid-input-light:focus {
    outline: none;
    border-color: var(--dot-cyan);
    box-shadow: 0 0 0 4px rgba(45,212,212,.18);
    background: white;
}

textarea.liquid-input,
textarea.liquid-input-light { min-height: 120px; resize: vertical; }

/* ====== Pricing tabs ====== */
.pricing-tab {
    position: relative;
    padding: .65rem 1.25rem;
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 500;
    color: var(--ink-soft);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: color .3s ease;
    z-index: 1;
}
.pricing-tab[aria-selected="true"] { color: #042024; }
.pricing-tab-indicator {
    position: absolute;
    top: 6px; bottom: 6px;
    border-radius: 999px;
    background: linear-gradient(135deg, #b3fcfc 0%, #2DD4D4 50%, #38f0f0 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 6px 18px -4px rgba(45,212,212,.5);
    transition: left .45s cubic-bezier(.22,1,.36,1), width .45s cubic-bezier(.22,1,.36,1);
    z-index: 0;
}

/* ====== Marquee ====== */
.marquee {
    display: flex;
    gap: 3rem;
    animation: marquee 28s linear infinite;
    width: max-content;
}
@keyframes marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* ====== Reveal on scroll ====== */
.reveal       { opacity: 0; transform: translateY(20px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal.is-in { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
    .blob, .liquid-text, .btn-liquid-metal, .marquee { animation: none !important; }
    .reveal { opacity: 1; transform: none; transition: none; }
    html { scroll-behavior: auto; }
}

/* ====== Mobile performance: disabilita animazioni e filtri costosi ====== */
@media (max-width: 768px) {
    /* Blob: decorativi puri, invisibili su mobile — toglili dal layout */
    .blob { display: none !important; }

    /* Backdrop-filter blur: sostituito con solid semi-transparente */
    .liquid-glass,
    .liquid-glass-dark,
    .liquid-glass-light {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* Nessuna animazione su mobile */
    .btn-liquid-metal,
    .liquid-text,
    .marquee,
    .reveal { animation: none !important; }

    /* Hero image: no filter animation (cambia ogni frame = software rasterization) */
    .hero-img-animated {
        animation: none !important;
        filter: drop-shadow(0 24px 40px rgba(45,212,212,.15)) !important;
        will-change: auto !important;
    }

    /* Reveal: su mobile mostra tutto subito */
    .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ====== Scrollbar ====== */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--dot-light); }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #2DD4D4, #1e6a9c);
    border-radius: 10px;
}
::selection { background: var(--dot-cyan); color: var(--dot-navy-900); }

.text-balance { text-wrap: balance; }

/* ====== Helper link chrome (navbar/footer) tema chiaro ====== */
.nav-link    { color: var(--ink-soft); transition: color .2s ease; }
.nav-link:hover { color: var(--ink); }
.foot-link   { color: var(--ink-soft); transition: color .2s ease; }
.foot-link:hover { color: var(--ink); }
.foot-eyebrow{ color: var(--accent-deep); }
/* helper testo tema chiaro (swap delle utility text-white*) */
.t-ink   { color: var(--ink); }
.t-soft  { color: var(--ink-soft); }
.t-faint { color: var(--ink-faint); }
.t-accent{ color: var(--accent-deep); }

/* ====== Home v2 (fork + numeri) ====== */
.box-fork { transition: transform .2s cubic-bezier(.22,1,.36,1), box-shadow .25s cubic-bezier(.22,1,.36,1); }
.box-fork:hover { transform: translateY(-5px); box-shadow: 0 38px 72px -32px rgba(10,26,46,.34), 0 8px 24px -10px rgba(10,26,46,.12); }
.fork-arrow { transition: transform .2s ease; }
.box-fork:hover .fork-arrow { transform: translateX(5px); }
.fork-tag {
    align-self: flex-start;
    font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
    color: var(--accent-deep); background: var(--dot-light);
    padding: 6px 12px; border-radius: 999px;
}
/* Numeri: card di vetro (no griglia "foglio di calcolo") + count-up */
.home-stats {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem;
}
.home-stat {
    text-align: center; padding: 32px 18px; border-radius: 22px;
    background: linear-gradient(150deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.55) 100%);
    border: 1px solid rgba(255,255,255,.9);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95),
        0 20px 48px -26px rgba(10,26,46,.20),
        0 3px 10px -8px rgba(10,26,46,.08);
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s cubic-bezier(.22,1,.36,1);
}
.home-stat:hover { transform: translateY(-4px); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 30px 60px -28px rgba(10,26,46,.28); }
.home-stat__num { font-size: clamp(2.3rem, 4.4vw, 3.1rem); font-weight: 600; letter-spacing: -.03em; line-height: 1; color: var(--ink); font-variant-numeric: tabular-nums; }
.home-stat__num .suf { color: var(--accent-deep); }
.home-stat__label { margin-top: .6rem; font-size: .9rem; color: var(--ink-soft); }
@media (max-width: 760px) { .home-stats { grid-template-columns: repeat(2, 1fr); gap: .8rem; } }

/* ====== Cornice browser riusabile (hero + box fork) ====== */
.shot-browser { border-radius: 16px; overflow: hidden; background: rgba(255,255,255,.6); position: relative; }
.shot-browser__bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: rgba(255,255,255,.62); border-bottom: 1px solid var(--line); }
.shot-browser__dot { width: 10px; height: 10px; border-radius: 50%; background: #d6dee8; }
.shot-browser__url { margin-left: 10px; font-size: 12px; color: var(--ink-faint); background: #fff; border: 1px solid var(--line); border-radius: 7px; padding: 4px 12px; min-width: 0; max-width: 62%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shot-browser img { display: block; width: 100%; height: auto; }
/* mobile: barra compatta, l'URL non deve rubare la scena allo screenshot */
@media (max-width: 640px) {
  .shot-browser__bar { padding: 7px 10px; gap: 5px; }
  .shot-browser__dot { width: 8px; height: 8px; }
  .shot-browser__url { font-size: 10.5px; padding: 3px 8px; margin-left: 7px; border-radius: 6px; }
  .shot-browser__live { right: 10px; bottom: 10px; font-size: 10.5px; padding: 6px 10px; }
}
.shot-browser__live { position: absolute; right: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: #fff; background: rgba(15,36,64,.92); padding: 8px 14px; border-radius: 999px; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.shot-browser__live span { width: 6px; height: 6px; border-radius: 50%; background: #22D3EE; box-shadow: 0 0 0 4px rgba(34,211,238,.22); }
/* nei box fork: immagine ad aspetto fisso, ritaglio sensato in alto */
.shot-browser--fork img { aspect-ratio: 16 / 10; object-fit: cover; object-position: top center; }

/* ====== Form feedback ====== */
.form-error {
    color: #ffb3b3;
    font-size: .85rem;
    margin-top: .4rem;
}
.form-success-card {
    border: 1px solid rgba(45,212,212,.4);
    background: rgba(45,212,212,.08);
    border-radius: 22px;
    padding: 2.2rem;
    text-align: center;
    color: var(--ink);
}
.form-success-card .check {
    width: 56px; height: 56px;
    border-radius: 999px;
    background: rgba(45,212,212,.15);
    border: 1px solid rgba(45,212,212,.4);
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1.2rem;
    color: #38f0f0;
    font-size: 26px;
}

/* ====== Legal pages ====== */
.legal-content h2 {
    font-size: 1.4rem;
    margin-top: 2.4rem;
    margin-bottom: 1rem;
    padding-top: 1.4rem;
    border-top: 1px solid var(--line);
    color: var(--accent-deep);
    font-weight: 600;
}
.legal-content h3 { font-size: 1.1rem; margin-top: 1.4rem; color: var(--ink); font-weight: 600; }
.legal-content p  { color: var(--ink-soft); line-height: 1.7; margin: .8rem 0; }
.legal-content ul { color: var(--ink-soft); padding-left: 1.4rem; margin: .8rem 0; }
.legal-content li { margin: .35rem 0; }
.legal-content a  { color: var(--accent-deep); text-decoration: underline; text-underline-offset: 2px; }

/* ====== Card filiera (committente / fornitore) — hover ====== */
.card-filiera {
    transition: transform .25s cubic-bezier(.22,1,.36,1),
                box-shadow .25s cubic-bezier(.22,1,.36,1),
                border-color .2s ease;
    cursor: default;
}
.card-filiera:hover {
    transform: translateY(-6px);
}
.card-filiera--light {
    border: 1px solid rgba(14,159,159,.18);
}
.card-filiera--light:hover {
    border-color: rgba(45,212,212,.55);
    box-shadow: 0 20px 60px -16px rgba(45,212,212,.20), 0 8px 24px -8px rgba(0,0,0,.12);
}
.card-filiera--dark {
    border: 1px solid rgba(45,212,212,.12);
}
.card-filiera--dark:hover {
    border-color: rgba(56,240,240,.40);
    box-shadow: 0 20px 60px -16px rgba(56,240,240,.28), 0 8px 24px -8px rgba(0,0,0,.35);
}

/* ====== CTA — testo mobile/desktop ====== */
.cta-demo-full  { display: inline; }
.cta-demo-short { display: none; }
@media (max-width: 639px) {
    .cta-demo-full  { display: none; }
    .cta-demo-short { display: inline; }
}

/* Titolo hero: fluido, niente overflow su mobile (override delle utility text-*) */
.hero-title { font-size: clamp(2.4rem, 6.2vw, 4.5rem); line-height: 1.05; }

/* ====== Hero grid responsive ====== */
.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 3rem;
    align-items: center;
}
.hero-grid > * { min-width: 0; }
.hero-img-col { margin-right: 0; }

@media (min-width: 1024px) {
    .hero-grid { grid-template-columns: 44% minmax(0, 1fr); gap: 5rem; }
    .hero-img-col { margin-right: -4rem; }
}

/* ====== Hero animations ====== */
/* Float laptop — ombre tarate sul tema CHIARO (navy soft + glow ciano) */
@keyframes hero-float {
    0%   { transform: translateY(0px);
           filter: drop-shadow(0 30px 46px rgba(45,212,212,.20)) drop-shadow(0 16px 26px rgba(10,26,46,.16)); }
    50%  { transform: translateY(-22px);
           filter: drop-shadow(0 52px 70px rgba(45,212,212,.30)) drop-shadow(0 28px 40px rgba(10,26,46,.12)); }
    100% { transform: translateY(0px);
           filter: drop-shadow(0 30px 46px rgba(45,212,212,.20)) drop-shadow(0 16px 26px rgba(10,26,46,.16)); }
}
@keyframes hero-pulse {
    0%,100% { opacity:.68; transform:scale(1); }
    50%      { opacity:1;   transform:scale(1.12); }
}

/* ====== Sectors scroll (mobile: orizzontale; desktop: wrap) ====== */
.sectors-scroll {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.sectors-scroll__item { flex-shrink: 0; }

@media (max-width: 768px) {
    .sectors-scroll {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 4px;
        /* fade laterale per indicare scroll */
        -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
        mask-image: linear-gradient(to right, black 85%, transparent 100%);
    }
    .sectors-scroll::-webkit-scrollbar { display: none; }
}

/* ====== Login strip ====== */
.login-strip {
    position: relative;
    background:
        radial-gradient(120% 140% at 50% 0%, rgba(45,212,212,.14) 0%, transparent 60%),
        linear-gradient(180deg, #ffffff 0%, var(--dot-light) 100%);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    padding: 2.5rem 1.5rem;
    flex-wrap: wrap;
    overflow: hidden;
}
/* linea luminosa superiore */
.login-strip::before {
    content: "";
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: min(680px, 80%);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(8,145,178,.6), transparent);
}

.login-strip__label {
    color: var(--ink-soft);
    font-size: 1.0625rem;
    font-weight: 500;
    letter-spacing: .005em;
}

.btn-portal {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    background: linear-gradient(135deg, #0ea5e9 0%, #22d3ee 100%);
    color: #06141f;
    font-weight: 700;
    font-size: 1.0625rem;
    letter-spacing: .01em;
    padding: 1rem 2.4rem;
    border-radius: 50px;
    text-decoration: none;
    box-shadow:
        0 0 0 1px rgba(255,255,255,.18) inset,
        0 0 32px rgba(34,211,238,.55),
        0 10px 28px rgba(0,0,0,.40);
    transition: box-shadow .2s ease, transform .2s ease, background .2s ease;
    white-space: nowrap;
}

.btn-portal svg { stroke-width: 2.4; }

.btn-portal:hover {
    background: linear-gradient(135deg, #22d3ee 0%, #38f0f0 100%);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.28) inset,
        0 0 52px rgba(56,240,240,.80),
        0 12px 32px rgba(0,0,0,.40);
    transform: translateY(-2px);
    color: #06141f;
    text-decoration: none;
}

.btn-portal:active {
    transform: translateY(0);
    box-shadow:
        0 0 0 1px rgba(255,255,255,.18) inset,
        0 0 24px rgba(34,211,238,.50),
        0 4px 12px rgba(0,0,0,.40);
}

@media (max-width: 640px) {
    .login-strip { gap: 1.1rem; padding: 2rem 1.25rem; }
    .login-strip__label { font-size: 1rem; }
    .btn-portal { font-size: 1rem; padding: .9rem 2rem; }
}

/* =====================================================================
   Home v3 — sezioni "azienda vera": problema, come funziona, proof, trust
   ===================================================================== */

/* Etichetta di sezione (usata con parsimonia, non su ogni heading) */
.section-label {
    display: inline-flex; align-items: center; gap: .55rem;
    font-size: .75rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase;
    color: var(--accent-deep);
}
.section-label::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%;
    background: #06B6D4; box-shadow: 0 0 0 4px rgba(6,182,212,.16);
}

/* Tile icona (card problema / soluzione) */
.icon-tile {
    width: 48px; height: 48px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(150deg, rgba(45,212,212,.16), rgba(8,145,178,.10));
    border: 1px solid rgba(8,145,178,.18); color: var(--accent-deep);
    flex-shrink: 0;
}

/* Card generica (problema / step) con hover coerente alla fork */
.tile-card { transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s cubic-bezier(.22,1,.36,1); }
.tile-card:hover { transform: translateY(-5px); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 34px 64px -30px rgba(10,26,46,.30), 0 8px 22px -10px rgba(10,26,46,.12); }

/* Numero step (serif) */
.step-num {
    font-family: 'Instrument Serif', serif; font-style: italic;
    font-size: 3.2rem; line-height: 1; letter-spacing: -.01em;
    color: var(--accent-deep);
}

/* Come funziona — nodi del flusso */
.flow-node {
    border-radius: 14px; padding: 12px 16px; font-size: .9rem; font-weight: 500;
    color: var(--ink); display: flex; align-items: center; gap: 10px;
    background: rgba(255,255,255,.7); border: 1px solid var(--line);
}
.flow-node span.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent-deep); flex-shrink: 0; }
.flow-hub {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .7rem 1.5rem; border-radius: 999px;
    background: linear-gradient(135deg, rgba(45,212,212,.14), rgba(8,145,178,.10));
    border: 1px solid rgba(45,212,212,.45);
    font-family: 'Comfortaa', sans-serif; font-weight: 700; color: var(--accent-deep);
}
.flow-line { background: linear-gradient(90deg, rgba(45,212,212,.15), rgba(8,145,178,.55), rgba(45,212,212,.15)); }

/* Testimonianze */
.testi-card { position: relative; }
.testi-card .quote-mark {
    font-family: 'Instrument Serif', serif; font-style: italic;
    font-size: 3.4rem; line-height: .6; color: var(--accent); opacity: .5;
}
.testi-avatar {
    width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; font-size: .9rem; color: #fff;
    background: linear-gradient(135deg, #0891B2, #06B6D4);
}

/* Avatar stack (hero proof) */
.av-stack { display: flex; }
.av-stack span {
    width: 36px; height: 36px; border-radius: 50%; border: 2px solid #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 600; color: #fff;
}
.av-stack span + span { margin-left: -9px; }

/* CTA finale band */
.cta-band {
    background:
        radial-gradient(120% 130% at 50% 0%, rgba(45,212,212,.14) 0%, transparent 55%),
        linear-gradient(180deg, #F4FBFD 0%, #EAF4F9 100%);
    border-top: 1px solid var(--line);
}

@media (prefers-reduced-motion: reduce) {
    .step-num { animation: none !important; }
}

/* =====================================================================
   Sfondo LIQUIDO animato globale — riflessi che si muovono
   ===================================================================== */
.liquid-bg {
    position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
    contain: strict;
}
.liquid-bg .lb {
    position: absolute; border-radius: 50%; filter: blur(80px); will-change: transform;
}
.liquid-bg .lb-1 {
    width: 62vw; height: 62vw; left: -16vw; top: -12vw;
    background: radial-gradient(circle at 35% 35%, rgba(45,212,212,.34), transparent 66%);
    animation: lbDrift1 28s cubic-bezier(.45,0,.55,1) infinite;
}
.liquid-bg .lb-2 {
    width: 56vw; height: 56vw; right: -18vw; top: 6vh;
    background: radial-gradient(circle at 50% 50%, rgba(8,145,178,.28), transparent 68%);
    animation: lbDrift2 34s cubic-bezier(.45,0,.55,1) infinite;
}
.liquid-bg .lb-3 {
    width: 54vw; height: 54vw; left: 22vw; bottom: -22vh;
    background: radial-gradient(circle at 50% 50%, rgba(56,240,240,.24), transparent 70%);
    animation: lbDrift3 31s cubic-bezier(.45,0,.55,1) infinite;
}
/* riflesso lucido che ruota lentamente */
.liquid-bg .lb-sheen {
    position: absolute; inset: -45%;
    background: conic-gradient(from 0deg at 50% 50%,
        transparent 0deg, rgba(255,255,255,.16) 38deg, transparent 95deg,
        transparent 250deg, rgba(45,212,212,.12) 312deg, transparent 360deg);
    mix-blend-mode: screen; filter: blur(30px); will-change: transform;
    animation: lbRotate 46s linear infinite;
}
@keyframes lbDrift1 {
    0%,100% { transform: translate(0,0) scale(1); }
    33%     { transform: translate(8vw,6vh) scale(1.12); }
    66%     { transform: translate(-5vw,9vh) scale(.95); }
}
@keyframes lbDrift2 {
    0%,100% { transform: translate(0,0) scale(1); }
    33%     { transform: translate(-7vw,7vh) scale(1.1); }
    66%     { transform: translate(6vw,-5vh) scale(.92); }
}
@keyframes lbDrift3 {
    0%,100% { transform: translate(0,0) scale(1); }
    50%     { transform: translate(7vw,-8vh) scale(1.15); }
}
@keyframes lbRotate { to { transform: rotate(360deg); } }

/* Login strip + CTA band: translucide per lasciare passare lo sfondo liquido */
.login-strip {
    background:
        radial-gradient(120% 140% at 50% 0%, rgba(45,212,212,.12) 0%, transparent 60%),
        linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(238,246,251,.40) 100%) !important;
}
.cta-band {
    background:
        radial-gradient(120% 130% at 50% 0%, rgba(45,212,212,.12) 0%, transparent 55%),
        linear-gradient(180deg, rgba(244,251,253,.55) 0%, rgba(234,244,249,.42) 100%) !important;
}

/* =====================================================================
   Biforcazione evidente — due "porte" distinte, invitanti
   ===================================================================== */
.box-fork { position: relative; }
.box-fork::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; z-index: 3;
    opacity: .85; transition: opacity .25s ease;
}
.box-fork--a::before { background: linear-gradient(90deg,#0e9f9f,#22D3EE); }
.box-fork--b::before { background: linear-gradient(90deg,#0891b2,#0ea5e9); }
.box-fork:hover::before { opacity: 1; }
.box-fork--a:hover { box-shadow: 0 44px 80px -34px rgba(14,159,159,.45), 0 10px 26px -12px rgba(10,26,46,.14); }
.box-fork--b:hover { box-shadow: 0 44px 80px -34px rgba(8,145,178,.45), 0 10px 26px -12px rgba(10,26,46,.14); }

.fork-tag--a { color: #0b8f8f; background: rgba(45,212,212,.16); }
.fork-tag--b { color: #0876a0; background: rgba(8,145,178,.13); }

.fork-btn {
    align-self: flex-start;
    display: inline-flex; align-items: center; gap: .55rem;
    padding: .8rem 1.5rem; border-radius: 999px;
    font-weight: 600; font-size: .95rem; color: #fff; text-decoration: none;
    transition: transform .2s cubic-bezier(.22,1,.36,1), box-shadow .2s ease, filter .2s ease;
}
.fork-btn svg { transition: transform .2s ease; }
.box-fork:hover .fork-btn svg { transform: translateX(4px); }
.box-fork:hover .fork-btn { filter: brightness(1.06); }
.fork-btn--a { background: linear-gradient(135deg,#0e9f9f,#22D3EE); box-shadow: 0 10px 26px -10px rgba(14,159,159,.55), inset 0 1px 0 rgba(255,255,255,.4); }
.fork-btn--b { background: linear-gradient(135deg,#0891b2,#0ea5e9); box-shadow: 0 10px 26px -10px rgba(8,145,178,.55), inset 0 1px 0 rgba(255,255,255,.4); }

/* Diagramma "come funziona": barre che crescono al reveal */
.bar-fill { transform: scaleX(0); transform-origin: left center; transition: transform 1s cubic-bezier(.22,1,.36,1); }
.reveal.is-in .bar-fill { transform: scaleX(1); }

/* Sfondo liquido: versione più leggera ma ATTIVA su mobile (l'utente lo vuole) */
@media (max-width: 768px) {
    .liquid-bg .lb { filter: blur(55px); }
    .liquid-bg .lb-sheen { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .liquid-bg .lb, .liquid-bg .lb-sheen { animation: none !important; }
    .bar-fill { transition: none; transform: scaleX(1); }
}