@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');:root{--color-primary-light:#f5f3ff;--color-primary:#6366f1;--color-primary-hover:#4f46e5;--color-primary-text:#3730a3;--color-bg-base:#ffffff;--color-bg-offset:#fafafa;--color-bg-card:#ffffff;--color-border:#e4e4e7;--color-border-hover:#d4d4d8;--color-text-main:#18181b;--color-text-muted:#71717a;--color-text-light:#a1a1aa;--font-family:'Inter',sans-serif;--radius-default:8px;--radius-card:12px;--transition-speed:0.2s;}[data-theme="dark"]{--color-primary-light:#1e1b4b;--color-primary:#818cf8;--color-primary-hover:#a5b4fc;--color-primary-text:#e0e7ff;--color-bg-base:#09090b;--color-bg-offset:#18181b;--color-bg-card:#18181b;--color-border:#27272a;--color-border-hover:#3f3f46;--color-text-main:#f4f4f5;--color-text-muted:#a1a1aa;--color-text-light:#71717a;}html{font-size:17px;}
body{font-family:var(--font-family);font-size:1rem;background-color:var(--color-bg-base);color:var(--color-text-main);transition:background-color var(--transition-speed),color var(--transition-speed);}.bg-custom-base{background-color:var(--color-bg-base);}.bg-custom-offset{background-color:var(--color-bg-offset);}.bg-custom-card{background-color:var(--color-bg-card);}.border-custom{border-color:var(--color-border);}.border-custom-hover:hover{border-color:var(--color-border-hover);}.text-custom-main{color:var(--color-text-main);}.text-custom-muted{color:var(--color-text-muted);}.text-custom-light{color:var(--color-text-light);}.text-custom-primary{color:var(--color-primary-text);}.bg-brand-primary{background-color:var(--color-primary);}.bg-brand-hover:hover{background-color:var(--color-primary-hover);}.bg-brand-light{background-color:var(--color-primary-light);}.text-brand-primary{color:var(--color-primary);}.text-brand-text{color:var(--color-primary-text);}.border-brand-primary{border-color:var(--color-primary);}.border-brand-light{border-color:var(--color-primary-light);}.page-view{transition:opacity 0.2s ease-in-out,transform 0.2s ease-in-out;}.page-view.hidden{display:none;opacity:0;transform:translateY(4px);}
/* ==========================================================================
   Tailwind Utility CSS — pre-built subset for LandFNL preset plugins.
   Covers the utility classes used in landing-page prototype patterns.
   No external CDN required.
   ========================================================================== */

/* ---- Reset ---- */
*,::before,::after{box-sizing:border-box;}
a,.lc-suite a{text-decoration:none;}

/* ---- Display ---- */
.block{display:block}
.hidden{display:none}
.inline-flex{display:inline-flex}
.flex{display:flex}
.grid{display:grid}

/* ---- Flex ---- */
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.flex-grow{flex-grow:1}
.flex-1{flex:1 1 0%}
.shrink-0{flex-shrink:0}
.items-center{align-items:center}
.items-start{align-items:flex-start}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}

/* ---- Grid ---- */
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}
.col-span-5{grid-column:span 5/span 5}
.col-span-7{grid-column:span 7/span 7}
.col-span-12{grid-column:span 12/span 12}

/* ---- Gap ---- */
.gap-2{gap:.5rem}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}
.gap-10{gap:2.5rem}

/* ---- Space Y ---- */
.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}
.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem}
.space-y-8>:not([hidden])~:not([hidden]){margin-top:2rem}
.space-y-12>:not([hidden])~:not([hidden]){margin-top:3rem}
.space-y-20>:not([hidden])~:not([hidden]){margin-top:5rem}

/* ---- Space X ---- */
.space-x-1\.5>:not([hidden])~:not([hidden]){margin-left:.375rem}
.space-x-2>:not([hidden])~:not([hidden]){margin-left:.5rem}
.space-x-3>:not([hidden])~:not([hidden]){margin-left:.75rem}
.space-x-4>:not([hidden])~:not([hidden]){margin-left:1rem}
.space-x-6>:not([hidden])~:not([hidden]){margin-left:1.5rem}
.space-x-10>:not([hidden])~:not([hidden]){margin-left:2.5rem}

/* ---- Position ---- */
.absolute{position:absolute}
.relative{position:relative}
.fixed{position:fixed}
.sticky{position:sticky}
.inset-0{top:0;right:0;bottom:0;left:0;position:absolute}
.top-0{top:0}
.top-6{top:1.5rem}
.right-6{right:1.5rem}
.bottom-6{bottom:1.5rem}
.z-50{z-index:50}

/* ---- Overflow ---- */
.overflow-hidden{overflow:hidden}

/* ---- Width ---- */
.w-full{width:100%}
.w-1\.5{width:.375rem}
.w-2{width:.5rem}
.w-4{width:1rem}
.w-5{width:1.25rem}
.w-6{width:1.5rem}
.w-8{width:2rem}
.w-9{width:2.25rem}
.w-10{width:2.5rem}
.w-16{width:4rem}
.w-32{width:8rem}
.w-2\/3{width:66.666667%}
.w-5\/6{width:83.333333%}

/* ---- Height ---- */
.h-1{height:.25rem}
.h-1\.5{height:.375rem}
.h-2{height:.5rem}
.h-4{height:1rem}
.h-5{height:1.25rem}
.h-8{height:2rem}
.h-9{height:2.25rem}
.h-12{height:3rem}
.h-16{height:4rem}
.h-20{height:5rem}
.h-24{height:6rem}
.h-\[1px\]{height:1px}
.min-h-screen{min-height:100vh}
.min-h-\[160px\]{min-height:160px}

/* ---- Max Width ---- */
.max-w-xs{max-width:20rem}
.max-w-sm{max-width:24rem}
.max-w-lg{max-width:32rem}
.max-w-xl{max-width:36rem}
.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-6xl{max-width:72rem}

/* ---- Aspect Ratio ---- */
.aspect-video{aspect-ratio:16/9}

/* ---- Margin ---- */
.mx-auto{margin-left:auto;margin-right:auto}
.my-8{margin-top:2rem;margin-bottom:2rem}
.mt-1{margin-top:.25rem}
.mt-2{margin-top:.5rem}
.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}
.mt-8{margin-top:2rem}
.mt-12{margin-top:3rem}
.mb-1{margin-bottom:.25rem}
.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}
.mb-12{margin-bottom:3rem}
.mr-1{margin-right:.25rem}
.mr-2{margin-right:.5rem}

/* ---- Padding ---- */
.p-1{padding:.25rem}
.p-2{padding:.5rem}
.p-3{padding:.75rem}
.p-4{padding:1rem}
.p-6{padding:1.5rem}
.p-8{padding:2rem}
.px-1{padding-left:.25rem;padding-right:.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}
.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}
.py-0{padding-top:0;padding-bottom:0}
.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-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.pb-1{padding-bottom:.25rem}
.pb-24{padding-bottom:6rem}
.pt-2{padding-top:.5rem}
.pt-4{padding-top:1rem}
.pt-6{padding-top:1.5rem}
.pt-8{padding-top:2rem}
.pt-12{padding-top:3rem}
.pl-5{padding-left:1.25rem}

/* ---- Typography ---- */
.text-\[9px\]{font-size:9px;line-height:1.4}
.text-\[10px\]{font-size:10px;line-height:1.4}
.text-\[11px\]{font-size:11px;line-height:1.4}
.text-xs{font-size:.8125rem;line-height:1.1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-2\.5xl{font-size:1.6875rem;line-height:2.1rem}
.text-4\.5xl{font-size:2.625rem;line-height:1}
.font-light{font-weight:300}
.font-normal{font-weight:400}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.tracking-tight{letter-spacing:-.025em}
.tracking-wide{letter-spacing:.025em}
.tracking-wider{letter-spacing:.05em}
.tracking-widest{letter-spacing:.1em}
.leading-tight{line-height:1.25}
.leading-normal{line-height:1.5}
.leading-relaxed{line-height:1.625}
.uppercase{text-transform:uppercase}
.italic{font-style:italic}
.text-center{text-align:center}
.text-right{text-align:right}
.text-inherit{color:inherit}
.text-white{color:#fff}
.text-teal-600{color:#0d9488}
.text-zinc-300{color:#d4d4d8}
.text-zinc-700{color:#3f3f46}
.list-disc{list-style-type:disc}
.list-none{list-style-type:none}

/* ---- Borders ---- */
.border-0{border:none}
.border{border-width:1px;border-style:solid}
.border-2{border-width:2px;border-style:solid}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border-b-2{border-bottom-width:2px;border-bottom-style:solid}
.border-t{border-top-width:1px;border-top-style:solid}
.border-transparent{border-color:transparent}
.border-white{border-color:#fff}
.border-zinc-200{border-color:#e4e4e7}
.border-zinc-800{border-color:#27272a}
.border-opacity-20{border-color:rgb(0 0 0 / 0.2)}
.border-opacity-25{border-color:rgb(0 0 0 / 0.25)}
.border-opacity-30{border-color:rgb(0 0 0 / 0.3)}
[data-theme="dark"] .border-opacity-20{border-color:rgb(255 255 255 / 0.2)}
[data-theme="dark"] .border-opacity-25{border-color:rgb(255 255 255 / 0.25)}
[data-theme="dark"] .border-opacity-30{border-color:rgb(255 255 255 / 0.3)}
.rounded{border-radius:.25rem}
.rounded-md{border-radius:.375rem}
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-full{border-radius:9999px}
.ring-2{box-shadow:0 0 0 2px var(--tw-ring-color,currentColor)}
.ring-indigo-500{--tw-ring-color:#6366f1}

/* ---- Backgrounds ---- */
.bg-transparent{background-color:transparent}
.bg-white{background-color:#fff}
.bg-zinc-100{background-color:#f4f4f5}
.bg-zinc-200{background-color:#e4e4e7}
.bg-zinc-400{background-color:#a1a1aa}
.bg-zinc-800{background-color:#27272a}
.bg-zinc-900{background-color:#18181b}
.bg-teal-500{background-color:#14b8a6}
.bg-indigo-500{background-color:#6366f1}
.bg-emerald-700{background-color:#047857}

/* ---- Shadows ---- */
.shadow-sm{box-shadow:0 1px 2px 0 rgb(0 0 0/.05)}
.shadow-xl{box-shadow:0 20px 25px -5px rgb(0 0 0/.1),0 8px 10px -6px rgb(0 0 0/.1)}

/* ---- Opacity ---- */
.opacity-0{opacity:0}
.opacity-90{opacity:.9}

/* ---- Transform / Transition ---- */
.transform{transform:translateX(0)}
.scale-100{transform:scale(1)}
.scale-110{transform:scale(1.1)}
.translate-y-20{transform:translateY(5rem)}
.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-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.duration-300{transition-duration:.3s}

/* ---- Animation ---- */
@keyframes tw-pulse{50%{opacity:.5}}
.animate-pulse{animation:tw-pulse 2s cubic-bezier(.4,0,.6,1) infinite}

/* ---- Interaction ---- */
.cursor-pointer{cursor:pointer}
.focus\:outline-none:focus{outline:0}
.scroll-smooth{scroll-behavior:smooth}

/* ---- Selection ---- */
.selection\:bg-indigo-100 *::selection,.selection\:bg-indigo-100::selection{background-color:#e0e7ff}
.selection\:text-indigo-900 *::selection,.selection\:text-indigo-900::selection{color:#312e81}

/* ---- Group hover ---- */
.group:hover .group-hover\:bg-neutral-200{background-color:#e5e5e5}

/* ---- Hover states ---- */
.hover\:bg-zinc-800:hover{background-color:#27272a}
.hover\:bg-zinc-900:hover{background-color:#18181b}
.hover\:bg-neutral-100:hover{background-color:#f5f5f5}
.hover\:bg-opacity-80:hover{background-color:rgb(0 0 0 / 0.8)}
.hover\:border-zinc-300:hover{border-color:#d4d4d8}
.hover\:scale-110:hover{transform:scale(1.1)}
.hover\:shadow-sm:hover{box-shadow:0 1px 2px 0 rgb(0 0 0/.05)}
.hover\:bg-brand-hover:hover{background-color:var(--color-primary-hover)}
.hover\:bg-custom-offset:hover{background-color:var(--color-bg-offset)}
.hover\:text-custom-main:hover{color:var(--color-text-main)}
.hover\:border-custom:hover{border-color:var(--color-border)}

/* ---- Dark theme supplements ---- */
[data-theme="dark"] .dark\:bg-zinc-700{background-color:#3f3f46}
[data-theme="dark"] .dark\:bg-zinc-800{background-color:#27272a}
[data-theme="dark"] .dark\:border-zinc-900{border-color:#18181b}
[data-theme="dark"] .dark\:hover\:bg-neutral-800:hover{background-color:#262626}
[data-theme="dark"] .dark\:hover\:border-zinc-700:hover{border-color:#3f3f46}

/* ---- Responsive sm (640px) ---- */
@media (min-width:640px){
.sm\:flex-row{flex-direction:row}
.sm\:inline-flex{display:inline-flex}
.sm\:text-lg{font-size:1.125rem;line-height:1.75rem}
.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}
.sm\:text-4\.5xl{font-size:2.625rem;line-height:1}
}

/* ---- Responsive md (768px) ---- */
@media (min-width:768px){
.md\:flex{display:flex}
.md\:hidden{display:none}
.md\:items-start{align-items:flex-start}
.md\:text-left{text-align:left}
.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-12{grid-template-columns:repeat(12,minmax(0,1fr))}
.md\:col-span-5{grid-column:span 5/span 5}
.md\:col-span-7{grid-column:span 7/span 7}
}
