/* Generated by build/build.js from fonts.css + style.css + theme.css + tailwind.css + chat-widget.css - do not edit; edit the sources and run "npm run build". */
/* Generated by build/build.js - Prompt from @fontsource/prompt (SIL Open Font License 1.1) */
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:400;src:url(../fonts/prompt-thai-400.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:400;src:url(../fonts/prompt-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:500;src:url(../fonts/prompt-thai-500.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:500;src:url(../fonts/prompt-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:600;src:url(../fonts/prompt-thai-600.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:600;src:url(../fonts/prompt-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:700;src:url(../fonts/prompt-thai-700.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'Prompt';font-style:normal;font-display:swap;font-weight:700;src:url(../fonts/prompt-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* KTNBS - Custom CSS Styles */

/* CSS Variables */
:root {
    --primary: #0066cc;
    --primary-dark: #0052a3;
    --secondary: #00cc66;
    --accent: #f3f4f6;
    --muted: #6b7280;
    --danger: #dc2626;
    --warning: #f59e0b;
    --success: #10b981;
}

/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Prompt', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Typography */
h1 {
    @apply text-4xl md:text-5xl font-bold mb-4;
}

h2 {
    @apply text-3xl md:text-4xl font-bold mb-3;
}

h3 {
    @apply text-2xl md:text-3xl font-semibold mb-2;
}

h4 {
    @apply text-xl md:text-2xl font-semibold mb-2;
}

/* Animations */
@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fade-in 0.6s ease-out;
}

@keyframes slide-in-right {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-slide-in-right {
    animation: slide-in-right 0.6s ease-out;
}

@keyframes pulse-slow {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.animate-pulse-slow {
    animation: pulse-slow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Custom Utilities */
.text-gradient {
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.bg-gradient-primary {
    background: linear-gradient(135deg, var(--primary), #0052a3);
}

.bg-gradient-secondary {
    background: linear-gradient(135deg, var(--secondary), #00a352);
}

/* Card Styles */
.card {
    @apply bg-white rounded-lg shadow-sm hover:shadow-md transition-shadow p-6;
}

.card-hover {
    @apply transform hover:-translate-y-1 transition-transform duration-300;
}

/* Button Styles */
.btn {
    @apply px-6 py-3 rounded-lg font-medium transition-all duration-300 inline-flex items-center gap-2;
}

.btn-primary {
    @apply bg-primary text-white hover:bg-primary-dark;
}

.btn-secondary {
    @apply bg-secondary text-white hover:opacity-90;
}

.btn-outline {
    @apply border-2 border-primary text-primary hover:bg-primary hover:text-white;
}

/* Form Styles */
.form-input {
    @apply w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-all;
}

.form-label {
    @apply block text-sm font-medium text-gray-700 mb-2;
}

.form-error {
    @apply text-red-600 text-sm mt-1;
}

/* Section Styles */
.section {
    @apply py-16 md:py-20 lg:py-24;
}

.section-title {
    @apply text-3xl md:text-4xl font-bold text-center mb-4;
}

.section-subtitle {
    @apply text-lg md:text-xl text-muted text-center mb-12 max-w-3xl mx-auto;
}

/* Hero Section */
.hero {
    @apply relative min-h-[500px] md:min-h-[600px] lg:min-h-[700px] flex items-center justify-center;
}

.hero-overlay {
    @apply absolute inset-0 bg-black/40;
}

.hero-content {
    @apply relative z-10 text-center text-white max-w-4xl mx-auto px-4;
}

/* Grid Layouts */
.grid-products {
    @apply grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6;
}

.grid-blog {
    @apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8;
}

.grid-features {
    @apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8;
}

/* Badge Styles */
.badge {
    @apply inline-flex items-center px-3 py-1 rounded-full text-xs font-medium;
}

.badge-primary {
    @apply bg-primary/10 text-primary;
}

.badge-success {
    @apply bg-green-100 text-green-800;
}

.badge-warning {
    @apply bg-yellow-100 text-yellow-800;
}

.badge-danger {
    @apply bg-red-100 text-red-800;
}

/* Loading Spinner */
.spinner {
    @apply inline-block w-8 h-8 border-4 border-gray-200 border-t-primary rounded-full animate-spin;
}

/* Responsive Image */
.img-responsive {
    @apply w-full h-auto object-cover;
}

/* Product Card */
.product-card {
    @apply bg-white rounded-lg shadow-sm overflow-hidden hover:shadow-lg transition-all duration-300 transform hover:-translate-y-1;
}

.product-card-image {
    @apply w-full h-40 object-cover;
}

.product-card-body {
    @apply p-4;
}

/* Blog Card */
.blog-card {
    @apply bg-white rounded-lg shadow-sm overflow-hidden hover:shadow-md transition-shadow;
}

.blog-card-image {
    @apply w-full h-44 object-cover;
}

.blog-card-body {
    @apply p-6;
}

/* Testimonial */
.testimonial {
    @apply bg-white p-6 rounded-lg shadow-sm;
}

.testimonial-quote {
    @apply text-lg text-gray-700 mb-4 italic;
}

.testimonial-author {
    @apply flex items-center gap-3;
}

/* Breadcrumb */
.breadcrumb {
    @apply flex items-center gap-2 text-sm text-muted;
}

.breadcrumb-item {
    @apply flex items-center gap-2;
}

.breadcrumb-separator {
    @apply text-gray-400;
}

/* Table Styles */
.table {
    @apply w-full text-left border-collapse;
}

.table th {
    @apply bg-gray-100 px-4 py-3 font-semibold text-gray-700 border-b;
}

.table td {
    @apply px-4 py-3 border-b;
}

.table tr:hover {
    @apply bg-gray-50;
}

/* Dark Mode Support (for future) */
.dark {
    --primary: #3b82f6;
    --accent: #1f2937;
    --muted: #9ca3af;
}

.dark body {
    @apply bg-gray-900 text-gray-100;
}

.dark .card,
.dark .product-card,
.dark .blog-card {
    @apply bg-gray-800;
}

/* Print Styles */
@media print {
    nav,
    footer,
    .no-print {
        display: none !important;
    }
    
    body {
        font-size: 12pt;
    }
    
    h1 {
        font-size: 24pt;
    }
    
    h2 {
        font-size: 20pt;
    }
}

/* Accessibility */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Focus Styles */
*:focus-visible {
    @apply outline-2 outline-offset-2 outline-primary;
}

/* Skip to Content Link */
.skip-link {
    @apply absolute -top-10 left-0 bg-primary text-white px-4 py-2 z-50;
}

.skip-link:focus {
    @apply top-0;
}
/**
 * KTNBS - Public site theme (loaded after style.css)
 *
 * Direction: "logo colour blocks". The KTNBS wordmark is blue / yellow / sky, so the site is
 * light and flat, built from those three colours. Each product owns one colour and keeps it
 * everywhere (hero tile, section, icons), so colour is wayfinding, not decoration:
 *   DuckKit AI Portal = blue    IT Outsourcing = yellow    DocCapture = sky
 * No gradients, glows or grids. Type does the talking (Prompt for everything).
 * This is an override layer on Tailwind markup, so older pages pick the palette up too.
 */

:root {
    --blue: #177cb0;          /* logo K / S */
    --blue-600: #126a99;      /* buttons, links (6:1 on white) */
    --blue-800: #0d4666;
    --yellow: #ffcd05;        /* logo T / B */
    --yellow-600: #e8b800;
    --sky: #85cdeb;           /* logo N */
    --sky-100: #d9edf8;
    --sky-50: #eef7fc;
    --ink: #0c2a3d;
    --text: #1d3547;
    --soft: #4a6274;
    --rule: #d5e4ee;
    --radius: 20px;
    --radius-lg: 28px;
    --font-display: 'Prompt', sans-serif;
    --font-body: 'Prompt', sans-serif;
    --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ==========================================================================
   Type scale: ONE set of sizes for the whole public site (replaces ~18 near-identical sizes such as 14 / 14.4 / 14.7 /
   14.9 / 15.2 px). Every step is fluid (clamp), so text grows smoothly with the screen instead of jumping at
   breakpoints. Thai needs a little more size and line height than Latin, so body text starts at 16px.
   ========================================================================== */
:root {
    --fs-xs:      .78rem;  /* 12.5      captions, badges, tags */
    --fs-sm:      clamp(.875rem, .85rem + .1vw, .9375rem);  /* 14-15     secondary text, lists, UI */
    --fs-md:      clamp(.9375rem, .9rem + .15vw, 1rem);  /* 15-16     body text */
    --fs-lg:      clamp(1rem, .96rem + .25vw, 1.125rem);  /* 16-18     lead text, card titles */
    --fs-xl:      clamp(1.125rem, 1.05rem + .4vw, 1.25rem);  /* 18-20     small headings */
    --fs-2xl:     clamp(1.2rem, 1.05rem + .7vw, 1.5rem);  /* 19-24     h3 */
    --fs-3xl:     clamp(1.5rem, 1.15rem + 1.5vw, 2.25rem);  /* 24-36     h2 */
    --fs-4xl:     clamp(1.75rem, 1.2rem + 2.3vw, 2.8rem);  /* 28-45     h1 / hero */
    --fs-display: clamp(2.2rem, 1.5rem + 2.6vw, 3.2rem);  /* 35-51     big numbers */
    --lh-body: 1.75;      /* Thai marks above/below the line need room */
    --lh-ui: 1.6;
    --lh-head: 1.3;
}

body { font-size: var(--fs-md); }

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }

body {
    font-family: var(--font-body);
    color: var(--text);
    background: #fff;
    line-height: var(--lh-body);
}

h1, h2, h3, h4 { font-family: var(--font-display); color: var(--ink); letter-spacing: 0; }
h1 { line-height: 1.25; }
h2 { line-height: 1.3; }

:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; border-radius: 6px; }
::selection { background: var(--yellow); color: var(--ink); }

.container { max-width: 76rem; }

/* ---------- Navigation ---------- */
nav.site-nav {
    background: #fff;
    border-bottom: 1px solid var(--rule);
}
.nav-link {
    position: relative;
    padding: .35rem 0;
    font-weight: 500;
    color: var(--ink);
    transition: color .15s ease;
}
.nav-link::after {
    content: "";
    position: absolute; left: 0; right: 0; bottom: -2px;
    height: 3px; border-radius: 3px;
    background: var(--yellow);
    transform: scaleX(0); transform-origin: left;
    transition: transform .2s var(--ease);
}
.nav-link:hover { color: var(--blue-600); }
.nav-link:hover::after, .nav-link.is-active::after { transform: scaleX(1); }
.nav-link.is-active { color: var(--blue-800); font-weight: 600; }
.nav-icon { color: var(--ink); padding: .5rem; border-radius: 10px; transition: background-color .15s ease, color .15s ease; }
.nav-icon:hover { background: var(--sky-50); color: var(--blue-600); }
.nav-cta {
    display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; gap: .5rem;
    min-width: 10.5rem; /* same width in Thai and English, so the language button next to it does not move when the language changes */
    padding: .55rem 1.1rem; border-radius: 999px;
    background: var(--yellow); color: var(--ink);
    font: 600 var(--fs-sm) var(--font-display);
    transition: background-color .15s ease, transform .15s ease;
}
.nav-cta:hover { background: var(--yellow-600); transform: translateY(-1px); }
/* Menu dropdown: an invisible bridge covers the gap between the menu item and the panel, and the panel stays open for a moment
   after the pointer leaves, so it does not close while the pointer travels to it */
.group > .dropdown-menu { transition: opacity .18s ease, visibility 0s linear .4s; }
.group:hover > .dropdown-menu, .group:focus-within > .dropdown-menu { transition-delay: 0s; }
.dropdown-menu::before { content: ''; position: absolute; left: 0; right: 0; top: -1rem; height: 1rem; }
.dropdown-menu {
    border: 1px solid var(--rule);
    border-radius: 16px !important;
    box-shadow: 0 18px 40px -18px rgba(12, 42, 61, .35) !important;
    padding: .5rem !important;
}
.dropdown-menu a { border-radius: 10px; }
/* wide enough that Thai menu names stay on one line (Tailwind w-80 = 320px was wrapping the last word) */
html .dropdown-menu { width: max-content; min-width: 20rem; max-width: min(30rem, 92vw); }
.dropdown-menu a { padding-right: 1.25rem; }
.dropdown-menu a:hover { background: var(--sky-50) !important; color: var(--blue-800); }
.mobile-menu { background: #fff; border-top: 1px solid var(--rule); }
.m-link { display: block; padding: .8rem 1rem; border-radius: 12px; color: var(--ink); font-weight: 500; }
.m-link:hover, .m-link.is-active { background: var(--sky-50); color: var(--blue-800); }
.m-sub { display: block; padding: .5rem 1rem .5rem 1.5rem; color: var(--soft); font-size: var(--fs-sm); }
.m-sub:hover { color: var(--blue-800); }

/* ---------- Buttons ---------- */
.ktn-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    padding: .9rem 1.6rem; border-radius: 999px;
    font: 600 var(--fs-md) var(--font-display);
    transition: transform .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}
.ktn-btn:hover { transform: translateY(-2px); }
.ktn-btn-yellow { background: var(--yellow); color: var(--ink); }
.ktn-btn-yellow:hover { background: var(--yellow-600); }
.ktn-btn-solid { background: var(--blue-600); color: #fff; }
.ktn-btn-solid:hover { background: var(--blue-800); }
.ktn-btn-line { border: 2px solid var(--ink); color: var(--ink); }
.ktn-btn-line:hover { background: var(--ink); color: #fff; }
.ktn-btn-white { background: #fff; color: var(--ink); }
.ktn-btn-white:hover { background: var(--sky-50); }

/* Existing Tailwind button markup on inner pages */
main a.bg-blue-600, main a.bg-primary, main button.bg-primary, main button.bg-blue-600 { border-radius: 999px; }
main .text-primary { color: var(--blue-600); }
main .border-primary { border-color: var(--blue-600); }

/* ---------- Cards on inner pages ---------- */
main .rounded-lg.shadow-sm,
main .rounded-xl.shadow-md,
main .rounded-2xl.shadow-lg {
    border: 1px solid var(--rule);
    border-radius: var(--radius);
    box-shadow: none;
    transition: transform .2s var(--ease), border-color .2s ease;
}
main .rounded-lg.shadow-sm:hover,
main .rounded-xl.shadow-md:hover { transform: translateY(-3px); border-color: var(--blue); }
main .bg-gray-50, main .bg-gray-100 { background-color: var(--sky-50) !important; }
main .group img { transition: transform .5s var(--ease); }

/* ---------- Type helpers ---------- */
.eyebrow {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .3rem .8rem; border-radius: 999px;
    font: 600 var(--fs-xs) var(--font-display); letter-spacing: .04em; text-transform: uppercase;
    background: var(--sky-100); color: var(--blue-800);
    margin-bottom: 1rem;
}
.eyebrow.yellow { background: var(--yellow); color: var(--ink); }
.eyebrow.sky { background: var(--sky); color: var(--ink); }
.eyebrow.on-blue { background: #fff; color: var(--blue-800); }

mark.hl {
    white-space: nowrap;
    color: inherit;
    background: linear-gradient(transparent 56%, var(--yellow) 56%, var(--yellow) 92%, transparent 92%);
    padding: 0 .15em;
    -webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* ---------- HERO ---------- */
.ktn-hero { padding: clamp(.75rem, 2vw, 1.75rem) 0 clamp(1.5rem, 2.8vw, 2.5rem); background: #fff; }
.ktn-hero h1 { font-size: clamp(1.6rem, 1.1rem + 2vw, 2.5rem); font-weight: 700; line-height: 1.35; margin: .5rem 0 1rem; }   /* 26-40px; own line-height so it does not collide with the eyebrow above */
.ktn-hero .lead { font-size: var(--fs-md); color: var(--soft); max-width: 33rem; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: .6rem; font: 600 var(--fs-sm) var(--font-display); color: var(--blue-800); }
.hero-eyebrow i { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; }
.hero-eyebrow i:nth-child(1) { background: var(--blue); }
.hero-eyebrow i:nth-child(2) { background: var(--yellow); }
.hero-eyebrow i:nth-child(3) { background: var(--sky); }
.hero-partners { margin-top: 2.25rem; padding-top: 1.25rem; border-top: 1px solid var(--rule); font-size: var(--fs-sm); color: var(--soft); }
.hero-partners strong { color: var(--ink); font-weight: 600; }

/* product tiles: the signature */
.tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.tile {
    position: relative; display: flex; flex-direction: column; gap: 1.1rem;
    padding: 1.6rem; border-radius: var(--radius-lg);
    min-height: 12.5rem;
    transition: transform .25s var(--ease);
}
.tile:hover { transform: translateY(-4px); }
.tile .t-ic { width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--ink); }
.tile b { display: block; font: 700 var(--fs-2xl)/1.25 var(--font-display); }
.tile small { display: block; margin-top: .3rem; font-size: var(--fs-sm); line-height: 1.55; opacity: .88; }
.tile > div { margin-top: auto; }
.tile .t-go { position: absolute; top: 1.4rem; right: 1.4rem; width: 2.5rem; height: 2.5rem; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.22); transition: transform .25s var(--ease), background-color .2s ease; }
.tile:hover .t-go { transform: translate(3px, -3px); background: #fff; color: var(--ink); }
.tile.blue { grid-row: span 2; background: var(--blue-600); color: #fff; min-height: 26rem; }
.tile.blue .t-ic { color: var(--blue-600); }
.tile.yellow { background: var(--yellow); color: var(--ink); }
.tile.sky { background: var(--sky); color: var(--ink); }
.tile.yellow .t-go, .tile.sky .t-go { background: rgba(12,42,61,.1); }
.tile.yellow:hover .t-go, .tile.sky:hover .t-go { background: var(--ink); color: #fff; }
.t-models { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1rem; }
.t-models span { font: 500 var(--fs-xs) var(--font-display); padding: .25rem .65rem; border-radius: 999px; background: rgba(255,255,255,.18); }

/* hero entrance: one orchestrated rise */
.reveal { opacity: 0; transform: translateY(14px); animation: ktn-rise .7s var(--ease) forwards; }
.reveal.d1 { animation-delay: .08s; } .reveal.d2 { animation-delay: .18s; } .reveal.d3 { animation-delay: .28s; } .reveal.d4 { animation-delay: .4s; }
@keyframes ktn-rise { to { opacity: 1; transform: none; } }

@media (max-width: 640px) {
    .tiles { grid-template-columns: 1fr; }
    .tile.blue { grid-row: auto; min-height: 0; }
    .tile { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
    .reveal { opacity: 1; transform: none; }
}

/* ---------- Bands ---------- */
.band { padding: clamp(2.25rem, 4.5vw, 3.75rem) 0; background: #fff; }
.band.alt { background: var(--sky-50); }
.band.blue { background: var(--blue-600); color: #e3f1f9; }
.band-head { max-width: 46rem; margin-bottom: 1.75rem; }
.band-head h2 { font-size: var(--fs-3xl); font-weight: 700; margin: 0 0 .75rem; }
.band.blue h2, .band.blue h3, .band.blue h4 { color: #fff; }
.band-lead { font-size: var(--fs-lg); color: var(--soft); margin: 0; }
.band.blue .band-lead { color: #d3e9f5; }
.band-sub { font-size: var(--fs-2xl); font-weight: 700; margin: 2rem 0 1rem; }
.band-cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.band-cta-end { justify-content: flex-end; }   /* "See details" at the bottom right of each product band on the home page */

.model-strip { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 .5rem; }
.model-strip span { font: 600 var(--fs-sm) var(--font-display); padding: .45rem 1.05rem; border-radius: 999px; background: #fff; color: var(--blue-800); }

/* DuckKit (blue band) */
.card-dark { padding: 1.5rem; border-radius: var(--radius); background: var(--blue-800); transition: transform .2s var(--ease); }
.card-dark:hover { transform: translateY(-3px); }
.card-dark :is(h3, h4) { font-size: var(--fs-lg); margin: 1rem 0 .45rem; }
.card-dark p { font-size: var(--fs-sm); color: #cfe5f2; margin: 0; line-height: 1.7; }
.card-dark .ic { width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--blue-600); }
.card-dark.warn { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.3rem; background: #fff; }
.card-dark.warn :is(h3, h4) { margin: 0; font-size: var(--fs-md); color: var(--ink); }
.card-dark.warn svg { flex: none; color: var(--ink); }
.feat-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.feat-grid.four { grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.feat-grid.three { grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }

/* IT Outsourcing (yellow accents) */
.svc-card { padding: 1.5rem; border: 1px solid var(--rule); border-top: 6px solid var(--yellow); border-radius: var(--radius); background: #fff; transition: transform .2s var(--ease), border-color .2s ease; }
.svc-card:hover { transform: translateY(-3px); border-color: var(--yellow-600); }
.svc-card .ic { width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center; background: var(--yellow); color: var(--ink); }
.svc-card :is(h3, h4) { margin: 1rem 0 .6rem; font-size: var(--fs-xl); }
.svc-card ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; font-size: var(--fs-sm); color: var(--soft); }
.svc-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 2.25rem; padding-top: 1.5rem; border-top: 1px solid var(--rule); }
.svc-foot p { margin: 0 auto 0 0; color: var(--soft); }
.svc-foot strong { color: var(--ink); }

/* DocCapture (sky accents) */
.card-light { padding: 1.5rem; border-radius: var(--radius); background: #fff; border: 1px solid var(--sky-100); }
.card-light :is(h3, h4) { margin: 1rem 0 .45rem; font-size: var(--fs-lg); }
.card-light p { margin: 0; font-size: var(--fs-sm); color: var(--soft); line-height: 1.7; }
.card-light .ic { width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center; background: var(--sky); color: var(--ink); }

.flow { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
.flow li { padding: 1.3rem; border-radius: var(--radius); background: #fff; border: 1px solid var(--sky-100); }
.flow .n { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--sky); color: var(--ink); font: 700 var(--fs-sm) var(--font-display); margin-bottom: .7rem; }
.flow b { font-family: var(--font-display); display: block; margin-bottom: .3rem; color: var(--ink); }
.flow p { margin: 0; font-size: var(--fs-sm); color: var(--soft); }
.flow.tight { grid-template-columns: repeat(3, 1fr); align-content: start; }

.stat-stack { display: grid; gap: 1rem; }
.stat-box { padding: 1.5rem; border-radius: var(--radius); background: var(--blue-600); color: #fff; }
.stat-box:nth-child(2) { background: var(--yellow); color: var(--ink); }
.stat-box small { display: block; font-size: var(--fs-sm); opacity: .9; }
.stat-box strong { display: block; font: 700 var(--fs-display)/1.1 var(--font-display); margin: .3rem 0; }
.stat-box strong span { font: 500 var(--fs-md) var(--font-body); opacity: .85; }
.stat-box p { margin: 0; font-size: var(--fs-xs); opacity: .85; }

/* ---------- Why us ---------- */
.why-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.why-card { padding: 1.6rem; border-radius: var(--radius); border: 1px solid var(--rule); background: #fff; }
.why-card::before { content: ""; display: block; width: 2.5rem; height: 6px; border-radius: 6px; margin-bottom: 1.1rem; background: var(--c, var(--blue)); }
.why-card:nth-child(2) { --c: var(--yellow); }
.why-card:nth-child(3) { --c: var(--sky); }
.why-num { font: 700 var(--fs-display)/1.1 var(--font-display); color: var(--blue-600); }
.why-card h3 { font-size: var(--fs-lg); margin: .4rem 0 .35rem; }
.why-card p { margin: 0; font-size: var(--fs-sm); color: var(--soft); }

/* ---------- Partners ---------- */
.partner-grid { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); }
.partner { display: flex; align-items: center; justify-content: center; min-height: 5.5rem; padding: 1rem; border: 1px solid var(--rule); border-radius: 16px; background: #fff; font: 600 var(--fs-sm) var(--font-display); color: var(--soft); text-align: center; transition: border-color .2s ease, transform .2s var(--ease); }
.partner:hover { border-color: var(--blue); transform: translateY(-2px); color: var(--blue-800); }
.partner img { max-width: 100%; max-height: 3.5rem; object-fit: contain; }

/* ---------- Final CTA ---------- */
.cta-band { background: var(--yellow); color: var(--ink); padding: clamp(3.5rem, 7vw, 5.5rem) 0; }
.cta-band h2 { font-size: var(--fs-3xl); font-weight: 700; margin: 0 0 .75rem; }
.cta-band p.lead { font-size: var(--fs-lg); margin: 0 0 1.75rem; max-width: 36rem; }
.cta-contacts { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 2px solid rgba(12,42,61,.18); }
.cta-contacts a { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; padding: .4rem 0; }
.cta-contacts a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ktn-btn-ink { background: var(--ink); color: #fff; }
.ktn-btn-ink:hover { background: var(--blue-800); }

/* ---------- Footer ---------- */
footer.site-footer { background: var(--ink); border-top: 8px solid var(--yellow); }
footer.site-footer h3 { color: #fff; font-family: var(--font-display); font-size: var(--fs-lg); }
footer.site-footer a:hover { color: var(--yellow) !important; }
footer.site-footer .logo-badge { display: inline-flex; padding: .55rem .8rem; border-radius: 12px; background: #fff; }
footer.site-footer .logo-badge img { height: 1.6rem; width: auto; }
footer.site-footer .social { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: rgba(255,255,255,.1); display: grid; place-items: center; transition: background-color .15s ease, color .15s ease; }
footer.site-footer .social:hover { background: var(--yellow); color: var(--ink) !important; }
footer.site-footer .text-blue-400 { color: var(--sky) !important; }

/* ---------- Cookie bar + floating UI ---------- */
#cookieConsent { background: #fff !important; color: var(--text) !important; border-top: 1px solid var(--rule) !important; box-shadow: 0 -10px 30px -16px rgba(12,42,61,.35) !important; }
#cookieConsent button { background: var(--yellow) !important; color: var(--ink) !important; border-radius: 999px !important; }
#cookieConsent a { border: 2px solid var(--ink) !important; color: var(--ink) !important; border-radius: 999px !important; }
#cookieConsent a:hover { background: var(--ink) !important; color: #fff !important; }
#back-to-top { background: var(--ink); }
#back-to-top:hover { background: var(--blue-600); }
.ktnbs-chat-button { background: var(--yellow) !important; box-shadow: 0 8px 20px -8px rgba(12,42,61,.55) !important; }
.ktnbs-chat-button svg { color: var(--ink) !important; }

@media (max-width: 720px) {
    .flow.tight { grid-template-columns: 1fr; }
}

/* ---------- Landing pages (/duckkit, /it-outsourcing, /doccapture) ---------- */
.band-head h1 { font-size: var(--fs-4xl); font-weight: 700; line-height: 1.2; margin: 0 0 .75rem; }
.band.blue .band-head h1 { color: #fff; }
.band-note { color: var(--soft); max-width: 46rem; margin: -.25rem 0 1.5rem; }
.band.blue .band-note { color: #d3e9f5; }
.band-note.center { margin: 2rem auto 0; text-align: center; }

.compare-dark { border-radius: var(--radius); overflow: hidden; background: var(--blue-800); }
.cd-head, .cd-row { display: grid; grid-template-columns: 8rem 1fr 1fr; gap: 1rem; padding: .95rem 1.3rem; align-items: start; }
.cd-head { background: rgba(255,255,255,.08); font: 600 var(--fs-sm) var(--font-display); color: #cfe5f2; }
.cd-head span:last-child { color: var(--yellow); }
.cd-row { border-top: 1px solid rgba(255,255,255,.12); font-size: var(--fs-sm); color: #e3f1f9; }
.cd-row b { color: #fff; font-family: var(--font-display); }
.cd-row span { display: flex; gap: .55rem; align-items: flex-start; }
.cd-row .bad { color: #b9d6e6; }
.cd-row .bad svg { flex: none; margin-top: .25rem; color: #9ec3d8; }
.cd-row .good { color: #fff; font-weight: 500; }
.cd-row .good svg { flex: none; margin-top: .25rem; color: var(--yellow); }

.compare-light { background: #fff; border: 1px solid var(--sky-100); border-radius: var(--radius); overflow: hidden; }
.cl-title { padding: 1.1rem 1.3rem; font: 700 var(--fs-lg) var(--font-display); color: var(--ink); border-bottom: 1px solid var(--sky-100); }
.cl-head, .cl-row { display: grid; grid-template-columns: 7rem 1fr 1fr; gap: 1rem; padding: .95rem 1.3rem; font-size: var(--fs-sm); }
.cl-head { background: var(--sky-50); font: 600 var(--fs-sm) var(--font-display); color: var(--soft); }
.cl-head span:last-child { color: var(--blue-800); }
.cl-row { border-top: 1px solid var(--sky-100); color: var(--soft); }
.cl-row b { color: var(--ink); font-family: var(--font-display); }
.cl-row .win { color: var(--ink); font-weight: 500; }

.band.cta-yellow { background: var(--yellow); text-align: center; }
.band.cta-yellow h2 { font-size: var(--fs-3xl); font-weight: 700; margin: 0 0 .5rem; }
.band.cta-yellow p { color: var(--ink); margin: 0 0 1.5rem; }

@media (max-width: 720px) {
    .cd-head, .cl-head { display: none; }
    .cd-row, .cl-row { grid-template-columns: 1fr; gap: .4rem; }
}

.card-dark.warn { align-items: flex-start; }
.card-dark.warn p { color: var(--soft); font-size: var(--fs-sm); margin: .35rem 0 0; }

/* ---------- Partners: quiet logo wall ---------- */
.partner-grid { grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr)); gap: 1.25rem 1.5rem; align-items: center; }
.partner { min-height: 3.5rem; padding: .25rem .5rem; border: 0; border-radius: 0; background: none; font-size: var(--fs-xs); }
.partner:hover { transform: none; }
.partner img { max-height: 2.6rem; filter: grayscale(1); opacity: .7; transition: filter .2s ease, opacity .2s ease; }
.partner:hover img { filter: none; opacity: 1; }
.partner-more { margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--rule); }
.partner-more > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .45rem; font: 600 var(--fs-md) var(--font-display); color: var(--blue-600); margin-bottom: 1.25rem; }
.partner-more > summary::-webkit-details-marker { display: none; }
.partner-more > summary svg { transition: transform .2s ease; }
.partner-more[open] > summary svg { transform: rotate(180deg); }
.partner-more .when-open, .partner-more[open] .when-closed { display: none; }
.partner-more[open] .when-open { display: inline; }

/* ---------- Partners: sideways marquee (replaces the expander) ---------- */
.partner-marquee { position: relative; overflow: hidden; padding: .5rem 0;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.marquee-track { display: flex; align-items: center; gap: 3.5rem; width: max-content; animation: partner-scroll var(--dur, 60s) linear infinite; }
.partner-marquee:hover .marquee-track, .partner-marquee:focus-within .marquee-track { animation-play-state: paused; }
.marquee-track .partner { flex: none; width: 8.5rem; min-height: 3.5rem; }
@keyframes partner-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
    .partner-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
    .marquee-track { animation: none; }
}

/* ---------- Hero tiles: faint photo background ---------- */
.tile { overflow: hidden; isolation: isolate; }
.tile > .t-bg { position: absolute; inset: 0; z-index: -1; background-repeat: no-repeat; pointer-events: none;
    -webkit-mask-image: linear-gradient(to left, #000 20%, transparent 90%);
            mask-image: linear-gradient(to left, #000 20%, transparent 90%); }
.tile.blue .t-bg { background-image: url('../images/home/duckkit-bg.webp'); background-size: cover; background-position: 85% 100%; opacity: .38; }
.tile.yellow .t-bg { background-image: url('../images/home/it-outsourcing-bg.webp'); background-size: 400% auto; background-position: 100% 0; filter: grayscale(1) contrast(1.1); mix-blend-mode: multiply; opacity: .3; }
.tile.sky .t-bg { background-image: url('../images/home/doccapture-bg.webp'); background-size: 210% auto; background-position: 72% 100%; filter: grayscale(1) contrast(1.1); mix-blend-mode: multiply; opacity: .3; }

/* ---------- FAQ accordion (landing pages) ---------- */
.faq-list { max-width: 52rem; display: grid; gap: .75rem; }
.faq-list details { background: #fff; border: 1px solid var(--sky-100); border-radius: var(--radius); }
.faq-list summary { cursor: pointer; list-style: none; padding: 1rem 3rem 1rem 1.25rem; font: 600 var(--fs-md) var(--font-display); color: var(--ink); position: relative; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%); font-size: 1.4rem; line-height: 1; color: var(--blue-600); }
.faq-list details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-list details[open] summary { border-bottom: 1px solid var(--sky-100); }
.faq-list summary:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }
.faq-list p { margin: 0; padding: 1rem 1.25rem 1.2rem; color: var(--soft); line-height: 1.75; }

/* ---------- LINE contact ---------- */
.line-fab { position: fixed; right: 22px; bottom: 92px; z-index: 45; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center;
    background: #06c755; color: #fff; border-radius: 50%; box-shadow: 0 4px 12px rgba(0,0,0,.28); text-decoration: none; transition: transform .2s, box-shadow .2s, background .2s; }
.line-fab svg { width: 30px; height: 30px; }
.line-fab span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } /* text for screen readers only */
.line-fab:hover { background: #05b34c; transform: scale(1.1); box-shadow: 0 6px 20px rgba(0,0,0,.35); color: #fff; }
.line-fab:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
#back-to-top { bottom: 10.5rem !important; } /* stacked above the LINE and AI chat buttons */
.ktn-btn-line-app { background: #06c755; color: #fff; border: 2px solid #06c755; margin-left: .5rem; }
.ktn-btn-line-app:hover { background: #05b34c; border-color: #05b34c; color: #fff; }

/* Tailwind text-* utilities mapped onto the same scale (also their sm:/md:/lg: variants, which are now fluid) */
html .text-xs, html .sm\:text-xs, html .md\:text-xs, html .lg\:text-xs, html .xl\:text-xs { font-size: var(--fs-xs); line-height: var(--lh-ui); }
html .text-sm, html .sm\:text-sm, html .md\:text-sm, html .lg\:text-sm, html .xl\:text-sm { font-size: var(--fs-sm); line-height: var(--lh-ui); }
html .text-base, html .sm\:text-base, html .md\:text-base, html .lg\:text-base, html .xl\:text-base { font-size: var(--fs-md); line-height: var(--lh-body); }
html .text-lg, html .sm\:text-lg, html .md\:text-lg, html .lg\:text-lg, html .xl\:text-lg { font-size: var(--fs-lg); line-height: 1.65; }
html .text-xl, html .sm\:text-xl, html .md\:text-xl, html .lg\:text-xl, html .xl\:text-xl { font-size: var(--fs-xl); line-height: 1.55; }
html .text-2xl, html .sm\:text-2xl, html .md\:text-2xl, html .lg\:text-2xl, html .xl\:text-2xl { font-size: var(--fs-2xl); line-height: var(--lh-head); }
html .text-3xl, html .sm\:text-3xl, html .md\:text-3xl, html .lg\:text-3xl, html .xl\:text-3xl { font-size: clamp(1.35rem, 1.1rem + 1vw, 1.75rem); line-height: var(--lh-head); }
html .text-4xl, html .sm\:text-4xl, html .md\:text-4xl, html .lg\:text-4xl, html .xl\:text-4xl { font-size: var(--fs-3xl); line-height: 1.25; }
html .text-5xl, html .sm\:text-5xl, html .md\:text-5xl, html .lg\:text-5xl, html .xl\:text-5xl { font-size: clamp(1.6rem, 1.15rem + 1.8vw, 2.4rem); line-height: 1.2; }
html .text-6xl, html .sm\:text-6xl, html .md\:text-6xl, html .lg\:text-6xl, html .xl\:text-6xl { font-size: var(--fs-4xl); line-height: 1.2; }

/* ==========================================================================
   Landing pages (duckkit / it-outsourcing / doccapture): hero with a framed product picture, numbered steps,
   "is it right for you" band. Helpers in includes/landing.php. Each product keeps its own colour:
   DuckKit = blue, IT Outsource = yellow, DocCapture = sky.
   ========================================================================== */
.lp-hero { --lp-bg: var(--blue-600); background: var(--lp-bg); color: #fff; padding: clamp(1.5rem, 3vw, 2.5rem) 0 0; position: relative; }
.lp-hero.tone-yellow { --lp-bg: var(--yellow); color: var(--ink); }
.lp-hero.tone-sky { --lp-bg: var(--sky); color: var(--ink); }
.lp-hero h1 { color: inherit; font-size: var(--fs-4xl); font-weight: 700; line-height: 1.25; margin: .9rem 0 1rem; }
.lp-lead { font-size: var(--fs-lg); max-width: 34rem; margin: 0; opacity: .96; }
.lp-hero-grid { display: grid; gap: 2rem clamp(2rem, 6vw, 5.5rem); align-items: center; justify-content: start; grid-template-columns: minmax(0, 32rem) minmax(0, 1fr); }
.lp-hero-copy { padding-bottom: 1.75rem; }
.lp-hero .model-strip { margin-top: 1.75rem; }
.lp-hero .model-strip span { background: rgba(255, 255, 255, .16); color: #fff; font-size: var(--fs-xs); padding: .3rem .8rem; }
.lp-hero.tone-yellow .model-strip span, .lp-hero.tone-sky .model-strip span { background: rgba(12, 42, 61, .1); color: var(--ink); }
.ktn-btn-ghost { border: 2px solid currentColor; color: inherit; }
.ktn-btn-ghost:hover { background: #fff; color: var(--ink); }

/* picture in a browser-style frame; in the hero it hangs over the edge into the next section */
.lp-shot { margin: 0; background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid rgba(12, 42, 61, .14); box-shadow: 0 30px 60px -28px rgba(12, 42, 61, .55); position: relative; z-index: 2; }
.lp-chrome { display: flex; gap: .4rem; padding: .6rem .9rem; background: #f1f5f8; border-bottom: 1px solid var(--rule); }
.lp-chrome i { width: .65rem; height: .65rem; border-radius: 50%; background: #c8d6e0; }
.lp-shot img { display: block; width: 100%; height: auto; }
.lp-hero .lp-shot { margin-bottom: -3.25rem; align-self: center; width: 100%; max-width: 36rem; justify-self: end; margin-right: 2.75rem; }
.lp-hero + .band { padding-top: calc(clamp(2.25rem, 4.5vw, 3.75rem) + 3.25rem); }
.lp-hero + .lp-fit { padding-top: calc(clamp(2rem, 4vw, 3rem) + 3.25rem); }
@media (max-width: 900px) {
    .lp-hero-grid { grid-template-columns: 1fr; }
    .lp-hero-copy { padding-bottom: 0; }
    .lp-hero .lp-shot { margin-bottom: -1.75rem; justify-self: start; margin-right: 0; }
    .lp-hero + .band { padding-top: calc(clamp(2.25rem, 4.5vw, 3.75rem) + 1.75rem); }
    .lp-hero + .lp-fit { padding-top: calc(clamp(2rem, 4vw, 3rem) + 1.75rem); }
}

/* "is it right for you" band */
.lp-fit { background: var(--yellow); padding: clamp(2rem, 4vw, 3rem) 0; }
.lp-fit-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 2rem; }
.lp-fit h2 { font-size: var(--fs-2xl); margin: 0 0 .35rem; }
.lp-fit p { margin: 0; max-width: 44rem; color: var(--ink); }
.lp-fit .band-cta { margin: 0; }
.band:not(.blue) .card-dark.warn { border: 1px solid var(--rule); }
.lp-shot.plain { background: #fff; padding: 0; }
.lp-fit.sky { background: var(--sky); }
.card-dark :is(h3, h4), .card-light :is(h3, h4), .svc-card :is(h3, h4) { font-weight: 600; }   /* card titles read as titles, not as body text */
*,:after,:before{--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:rgba(23,124,176,.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:rgba(23,124,176,.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: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Prompt,sans-serif;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,pre,samp{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,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{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}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.\!visible{visibility:visible!important}.visible{visibility:visible}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-0{bottom:0}.bottom-2{bottom:.5rem}.bottom-24{bottom:6rem}.bottom-8{bottom:2rem}.left-0{left:0}.left-4{left:1rem}.right-0{right:0}.right-2{right:.5rem}.right-4{right:1rem}.right-6{right:1.5rem}.right-8{right:2rem}.top-0{top:0}.top-1\/2{top:50%}.top-16{top:4rem}.top-2{top:.5rem}.top-24{top:6rem}.top-4{top:1rem}.top-full{top:100%}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.float-right{float:right}.\!my-0{margin-top:0!important;margin-bottom:0!important}.mx-1\.5{margin-left:.375rem;margin-right:.375rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.-mb-0\.5{margin-bottom:-.125rem}.-mb-1{margin-bottom:-.25rem}.-mb-1\.5{margin-bottom:-.375rem}.mb-0\.5{margin-bottom:.125rem}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-20{margin-bottom:5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-1{margin-left:.25rem}.ml-4{margin-left:1rem}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.line-clamp-2{-webkit-line-clamp:2}.line-clamp-2,.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.line-clamp-3{-webkit-line-clamp:3}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.contents{display:contents}.hidden{display:none}.aspect-video{aspect-ratio:16/9}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-2{height:.5rem}.h-20{height:5rem}.h-24{height:6rem}.h-3{height:.75rem}.h-32{height:8rem}.h-4{height:1rem}.h-40{height:10rem}.h-48{height:12rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-64{height:16rem}.h-8{height:2rem}.h-96{height:24rem}.h-\[500px\]{height:500px}.h-auto{height:auto}.h-full{height:100%}.max-h-\[600px\]{max-height:600px}.min-h-screen{min-height:100vh}.w-0{width:0}.w-1\/3{width:33.333333%}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-2{width:.5rem}.w-20{width:5rem}.w-24{width:6rem}.w-3{width:.75rem}.w-32{width:8rem}.w-4{width:1rem}.w-40{width:10rem}.w-48{width:12rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-8{width:2rem}.w-80{width:20rem}.w-auto{width:auto}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0}.min-w-full{min-width:100%}.min-w-max{min-width:-moz-max-content;min-width:max-content}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-7xl{max-width:80rem}.max-w-\[80\%\]{max-width:80%}.max-w-full{max-width:100%}.max-w-md{max-width:28rem}.max-w-none{max-width:none}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.grow{flex-grow:1}.border-separate{border-collapse:separate}.border-spacing-0{--tw-border-spacing-x:0px;--tw-border-spacing-y:0px;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y)}.-translate-x-full{--tw-translate-x:-100%}.-translate-x-full,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(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%}.rotate-3{--tw-rotate:3deg}.rotate-3,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(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 spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-pointer{cursor:pointer}.resize-none{resize:none}.resize{resize:both}.scroll-mt-20{scroll-margin-top:5rem}.scroll-mt-24{scroll-margin-top:6rem}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.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*(1 - var(--tw-space-x-reverse)))}.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*(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*(1 - var(--tw-space-x-reverse)))}.space-x-8>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(2rem*var(--tw-space-x-reverse));margin-left:calc(2rem*(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(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*(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*(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*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(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*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem*var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse))}.divide-gray-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235/var(--tw-divide-opacity,1))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-normal{white-space:normal}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.\!rounded-lg{border-radius:.5rem!important}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-\[0\.4rem\]{border-radius:.4rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-r-lg{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}.rounded-tl-sm{border-top-left-radius:.125rem}.rounded-tr-sm{border-top-right-radius:.125rem}.border{border-width:1px}.border-2{border-width:2px}.border-8{border-width:8px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-l{border-left-width:1px}.border-l-4{border-left-width:4px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-t-\[0\.5px\]{border-top-width:.5px}.border-amber-200{--tw-border-opacity:1;border-color:rgb(253 230 138/var(--tw-border-opacity,1))}.border-blue-200{--tw-border-opacity:1;border-color:rgb(181 220 240/var(--tw-border-opacity,1))}.border-blue-400{--tw-border-opacity:1;border-color:rgb(74 169 214/var(--tw-border-opacity,1))}.border-blue-500{--tw-border-opacity:1;border-color:rgb(23 124 176/var(--tw-border-opacity,1))}.border-blue-600{--tw-border-opacity:1;border-color:rgb(18 106 153/var(--tw-border-opacity,1))}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246/var(--tw-border-opacity,1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.border-green-200{--tw-border-opacity:1;border-color:rgb(187 247 208/var(--tw-border-opacity,1))}.border-green-400{--tw-border-opacity:1;border-color:rgb(74 222 128/var(--tw-border-opacity,1))}.border-green-500{--tw-border-opacity:1;border-color:rgb(34 197 94/var(--tw-border-opacity,1))}.border-primary{--tw-border-opacity:1;border-color:rgb(18 106 153/var(--tw-border-opacity,1))}.border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202/var(--tw-border-opacity,1))}.border-red-400{--tw-border-opacity:1;border-color:rgb(248 113 113/var(--tw-border-opacity,1))}.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68/var(--tw-border-opacity,1))}.border-red-600{--tw-border-opacity:1;border-color:rgb(220 38 38/var(--tw-border-opacity,1))}.border-transparent{border-color:transparent}.border-white{--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity,1))}.border-white\/10{border-color:hsla(0,0%,100%,.1)}.border-white\/20{border-color:hsla(0,0%,100%,.2)}.border-yellow-200{--tw-border-opacity:1;border-color:rgb(255 234 133/var(--tw-border-opacity,1))}.border-yellow-400{--tw-border-opacity:1;border-color:rgb(255 205 5/var(--tw-border-opacity,1))}.border-yellow-500{--tw-border-opacity:1;border-color:rgb(242 188 0/var(--tw-border-opacity,1))}.bg-amber-100{--tw-bg-opacity:1;background-color:rgb(254 243 199/var(--tw-bg-opacity,1))}.bg-amber-50{--tw-bg-opacity:1;background-color:rgb(255 251 235/var(--tw-bg-opacity,1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-blue-100{--tw-bg-opacity:1;background-color:rgb(217 237 248/var(--tw-bg-opacity,1))}.bg-blue-50{--tw-bg-opacity:1;background-color:rgb(238 247 252/var(--tw-bg-opacity,1))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgb(18 106 153/var(--tw-bg-opacity,1))}.bg-blue-700{--tw-bg-opacity:1;background-color:rgb(15 87 128/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.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-600{--tw-bg-opacity:1;background-color:rgb(75 85 99/var(--tw-bg-opacity,1))}.bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity,1))}.bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231/var(--tw-bg-opacity,1))}.bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244/var(--tw-bg-opacity,1))}.bg-primary{--tw-bg-opacity:1;background-color:rgb(18 106 153/var(--tw-bg-opacity,1))}.bg-purple-50{--tw-bg-opacity:1;background-color:rgb(250 245 255/var(--tw-bg-opacity,1))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity,1))}.bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-sky-500{--tw-bg-opacity:1;background-color:rgb(14 165 233/var(--tw-bg-opacity,1))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/20{background-color:hsla(0,0%,100%,.2)}.bg-yellow-100{--tw-bg-opacity:1;background-color:rgb(255 244 189/var(--tw-bg-opacity,1))}.bg-yellow-50{--tw-bg-opacity:1;background-color:rgb(255 251 230/var(--tw-bg-opacity,1))}.bg-yellow-500{--tw-bg-opacity:1;background-color:rgb(242 188 0/var(--tw-bg-opacity,1))}.bg-opacity-50{--tw-bg-opacity:0.5}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.from-blue-50{--tw-gradient-from:#eef7fc var(--tw-gradient-from-position);--tw-gradient-to:rgba(238,247,252,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-blue-500{--tw-gradient-from:#177cb0 var(--tw-gradient-from-position);--tw-gradient-to:rgba(23,124,176,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-blue-600,.from-primary{--tw-gradient-from:#126a99 var(--tw-gradient-from-position);--tw-gradient-to:rgba(18,106,153,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-primary\/10{--tw-gradient-from:rgba(18,106,153,.1) var(--tw-gradient-from-position);--tw-gradient-to:rgba(18,106,153,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.to-blue-600{--tw-gradient-to:#126a99 var(--tw-gradient-to-position)}.to-blue-700{--tw-gradient-to:#0f5780 var(--tw-gradient-to-position)}.to-blue-800{--tw-gradient-to:#0d4666 var(--tw-gradient-to-position)}.to-indigo-50{--tw-gradient-to:#eef2ff var(--tw-gradient-to-position)}.to-indigo-500\/10{--tw-gradient-to:rgba(99,102,241,.1) var(--tw-gradient-to-position)}.to-purple-600{--tw-gradient-to:#9333ea var(--tw-gradient-to-position)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-12{padding:3rem}.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}.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-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.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-12{padding-top:3rem;padding-bottom:3rem}.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.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-24{padding-top:6rem;padding-bottom:6rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-px{padding-top:1px;padding-bottom:1px}.pb-4{padding-bottom:1rem}.pl-12{padding-left:3rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-6{padding-left:1.5rem}.pl-7{padding-left:1.75rem}.pl-8{padding-left:2rem}.pr-4{padding-right:1rem}.pt-12{padding-top:3rem}.pt-16{padding-top:4rem}.pt-2{padding-top:.5rem}.pt-20{padding-top:5rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:Prompt,sans-serif}.\!text-sm{font-size:.875rem!important;line-height:1.25rem!important}.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\.9rem\]{font-size:.9rem}.text-\[1\.125rem\]{font-size:1.125rem}.text-\[1\.375rem\]{font-size:1.375rem}.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-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.\!leading-relaxed{line-height:1.625!important}.leading-\[1\.7\]{line-height:1.7}.leading-\[1\.88888\]{line-height:1.88888}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-wider{letter-spacing:.05em}.text-amber-600{--tw-text-opacity:1;color:rgb(217 119 6/var(--tw-text-opacity,1))}.text-amber-700{--tw-text-opacity:1;color:rgb(180 83 9/var(--tw-text-opacity,1))}.text-amber-800{--tw-text-opacity:1;color:rgb(146 64 14/var(--tw-text-opacity,1))}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-blue-100{--tw-text-opacity:1;color:rgb(217 237 248/var(--tw-text-opacity,1))}.text-blue-400{--tw-text-opacity:1;color:rgb(74 169 214/var(--tw-text-opacity,1))}.text-blue-500{--tw-text-opacity:1;color:rgb(23 124 176/var(--tw-text-opacity,1))}.text-blue-600{--tw-text-opacity:1;color:rgb(18 106 153/var(--tw-text-opacity,1))}.text-blue-700{--tw-text-opacity:1;color:rgb(15 87 128/var(--tw-text-opacity,1))}.text-blue-800{--tw-text-opacity:1;color:rgb(13 70 102/var(--tw-text-opacity,1))}.text-blue-900{--tw-text-opacity:1;color:rgb(11 53 80/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-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.text-green-600{--tw-text-opacity:1;color:rgb(22 163 74/var(--tw-text-opacity,1))}.text-green-700{--tw-text-opacity:1;color:rgb(21 128 61/var(--tw-text-opacity,1))}.text-green-800{--tw-text-opacity:1;color:rgb(22 101 52/var(--tw-text-opacity,1))}.text-primary{--tw-text-opacity:1;color:rgb(18 106 153/var(--tw-text-opacity,1))}.text-purple-600{--tw-text-opacity:1;color:rgb(147 51 234/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.text-red-800{--tw-text-opacity:1;color:rgb(153 27 27/var(--tw-text-opacity,1))}.text-red-900{--tw-text-opacity:1;color:rgb(127 29 29/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-white\/30{color:hsla(0,0%,100%,.3)}.text-white\/50{color:hsla(0,0%,100%,.5)}.text-white\/80{color:hsla(0,0%,100%,.8)}.text-yellow-400{--tw-text-opacity:1;color:rgb(255 205 5/var(--tw-text-opacity,1))}.text-yellow-600{--tw-text-opacity:1;color:rgb(217 166 0/var(--tw-text-opacity,1))}.text-yellow-700{--tw-text-opacity:1;color:rgb(166 127 0/var(--tw-text-opacity,1))}.text-yellow-800{--tw-text-opacity:1;color:rgb(122 94 0/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.decoration-1{text-decoration-thickness:1px}.underline-offset-2{text-underline-offset:2px}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-90{opacity:.9}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{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 rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-md{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 rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-sm,.shadow-xl{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 rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.ring-4{--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(4px + 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-blue-600{--tw-ring-opacity:1;--tw-ring-color:rgb(18 106 153/var(--tw-ring-opacity,1))}.blur{--tw-blur:blur(8px)}.blur,.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-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)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;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-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:gap-3:hover{gap:.75rem}.hover\:border-primary:hover{--tw-border-opacity:1;border-color:rgb(18 106 153/var(--tw-border-opacity,1))}.hover\:bg-blue-200:hover{--tw-bg-opacity:1;background-color:rgb(181 220 240/var(--tw-bg-opacity,1))}.hover\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgb(238 247 252/var(--tw-bg-opacity,1))}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(18 106 153/var(--tw-bg-opacity,1))}.hover\:bg-blue-700:hover{--tw-bg-opacity:1;background-color:rgb(15 87 128/var(--tw-bg-opacity,1))}.hover\:bg-blue-800:hover{--tw-bg-opacity:1;background-color:rgb(13 70 102/var(--tw-bg-opacity,1))}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\:bg-gray-300:hover{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity,1))}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.hover\:bg-gray-700:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}.hover\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.hover\:bg-sky-600:hover{--tw-bg-opacity:1;background-color:rgb(2 132 199/var(--tw-bg-opacity,1))}.hover\:bg-white:hover{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.hover\:bg-white\/10:hover{background-color:hsla(0,0%,100%,.1)}.hover\:bg-yellow-600:hover{--tw-bg-opacity:1;background-color:rgb(217 166 0/var(--tw-bg-opacity,1))}.hover\:text-blue-600:hover{--tw-text-opacity:1;color:rgb(18 106 153/var(--tw-text-opacity,1))}.hover\:text-blue-700:hover{--tw-text-opacity:1;color:rgb(15 87 128/var(--tw-text-opacity,1))}.hover\:text-blue-800:hover{--tw-text-opacity:1;color:rgb(13 70 102/var(--tw-text-opacity,1))}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.hover\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.hover\:text-green-700:hover{--tw-text-opacity:1;color:rgb(21 128 61/var(--tw-text-opacity,1))}.hover\:text-primary:hover{--tw-text-opacity:1;color:rgb(18 106 153/var(--tw-text-opacity,1))}.hover\:text-red-700:hover{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.hover\:text-yellow-400:hover{--tw-text-opacity:1;color:rgb(255 205 5/var(--tw-text-opacity,1))}.hover\:text-yellow-700:hover{--tw-text-opacity:1;color:rgb(166 127 0/var(--tw-text-opacity,1))}.hover\:underline:hover{text-decoration-line:underline}.hover\:decoration-current:hover{text-decoration-color:currentColor}.hover\:opacity-90:hover{opacity:.9}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.hover\:shadow-md:hover,.hover\:shadow-xl:hover{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 rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(23 124 176/var(--tw-border-opacity,1))}.focus\:border-primary:focus{--tw-border-opacity:1;border-color:rgb(18 106 153/var(--tw-border-opacity,1))}.focus\:decoration-current:focus{text-decoration-color:currentColor}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.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-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(23 124 176/var(--tw-ring-opacity,1))}.focus\:ring-primary:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(18 106 153/var(--tw-ring-opacity,1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.group[open] .group-open\:rotate-180{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:visible{visibility:visible}.group:hover .group-hover\:translate-x-1{--tw-translate-x:0.25rem}.group:hover .group-hover\:scale-105,.group:hover .group-hover\:translate-x-1{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(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}.group:hover .group-hover\:gap-3{gap:.75rem}.group:hover .group-hover\:bg-blue-200{--tw-bg-opacity:1;background-color:rgb(181 220 240/var(--tw-bg-opacity,1))}.group:hover .group-hover\:text-primary{--tw-text-opacity:1;color:rgb(18 106 153/var(--tw-text-opacity,1))}.group:hover .group-hover\:opacity-100,.group\/copy:hover .group-hover\/copy\:opacity-100{opacity:1}@media (min-width:640px){.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:hidden{display:none}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:p-6{padding:1.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width:768px){.md\:order-1{order:1}.md\:order-2{order:2}.md\:mb-1{margin-bottom:.25rem}.md\:mb-2{margin-bottom:.5rem}.md\:mb-4{margin-bottom:1rem}.md\:mb-6{margin-bottom:1.5rem}.md\:mb-8{margin-bottom:2rem}.md\:mr-2{margin-right:.5rem}.md\:mt-12{margin-top:3rem}.md\:mt-8{margin-top:2rem}.md\:block{display:block}.md\:inline{display:inline}.md\:flex{display:flex}.md\:h-12{height:3rem}.md\:h-16{height:4rem}.md\:h-20{height:5rem}.md\:h-4{height:1rem}.md\:h-48{height:12rem}.md\:h-5{height:1.25rem}.md\:h-80{height:20rem}.md\:h-full{height:100%}.md\:w-1\/3{width:33.333333%}.md\:w-12{width:3rem}.md\:w-16{width:4rem}.md\:w-2\/3{width:66.666667%}.md\:w-4{width:1rem}.md\:w-5{width:1.25rem}.md\:flex-shrink-0{flex-shrink:0}.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\:grid-cols-\[minmax\(0\2c 14rem\)_minmax\(0\2c 1fr\)_auto\]{grid-template-columns:minmax(0,14rem) minmax(0,1fr) auto}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:gap-2{gap:.5rem}.md\:gap-3{gap:.75rem}.md\:gap-4{gap:1rem}.md\:gap-6{gap:1.5rem}.md\:gap-8{gap:2rem}.md\:space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.md\:space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))}.md\:p-4{padding:1rem}.md\:p-6{padding:1.5rem}.md\:px-3{padding-left:.75rem;padding-right:.75rem}.md\:px-4{padding-left:1rem;padding-right:1rem}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:py-2{padding-top:.5rem;padding-bottom:.5rem}.md\:py-3{padding-top:.75rem;padding-bottom:.75rem}.md\:py-4{padding-top:1rem;padding-bottom:1rem}.md\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.md\:pt-4{padding-top:1rem}.md\:pt-8{padding-top:2rem}.md\:text-left{text-align:left}.md\:text-2xl{font-size:1.5rem;line-height:2rem}.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}.md\:text-4xl{font-size:2.25rem;line-height:2.5rem}.md\:text-5xl{font-size:3rem;line-height:1}.md\:text-base{font-size:1rem;line-height:1.5rem}.md\:text-lg{font-size:1.125rem;line-height:1.75rem}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:1024px){.lg\:sticky{position:sticky}.lg\:top-24{top:6rem}.lg\:col-span-1{grid-column:span 1/span 1}.lg\:col-span-2{grid-column:span 2/span 2}.lg\:col-span-3{grid-column:span 3/span 3}.lg\:ml-64{margin-left:16rem}.lg\:mt-16{margin-top:4rem}.lg\:block{display:block}.lg\:flex{display:flex}.lg\:inline-flex{display:inline-flex}.lg\:hidden{display:none}.lg\:h-96{height:24rem}.lg\:translate-x-0{--tw-translate-x:0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.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\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:grid-cols-\[1\.02fr_\.98fr\]{grid-template-columns:1.02fr .98fr}.lg\:grid-cols-\[1\.1fr_\.9fr_1\.5fr_1\.1fr_1\.3fr\]{grid-template-columns:1.1fr .9fr 1.5fr 1.1fr 1.3fr}.lg\:grid-cols-\[1\.4fr_1fr\]{grid-template-columns:1.4fr 1fr}.lg\:gap-12{gap:3rem}.lg\:gap-14{gap:3.5rem}.lg\:p-8{padding:2rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:py-16{padding-top:4rem;padding-bottom:4rem}.lg\:text-2xl{font-size:1.5rem;line-height:2rem}.lg\:text-4xl{font-size:2.25rem;line-height:2.5rem}.lg\:text-5xl{font-size:3rem;line-height:1}.lg\:text-6xl{font-size:3.75rem;line-height:1}}@media (min-width:1280px){.xl\:text-5xl{font-size:3rem;line-height:1}.xl\:text-6xl{font-size:3.75rem;line-height:1}}.\[\&\>\*\]\:break-words>*{overflow-wrap:break-word}
/**
 * KTNBS AI Chat Widget Styles
 * Modern floating chat interface
 */

/* Chat Widget Container */
#ktnbs-chat-widget {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    font-family: 'Prompt', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Chat Button */
.ktnbs-chat-button {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #126a99;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(30, 64, 175, 0.4);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ktnbs-chat-button:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(30, 64, 175, 0.5);
}

.ktnbs-chat-button svg {
    width: 28px;
    height: 28px;
    color: white;
    transition: all 0.3s ease;
}

.ktnbs-chat-icon {
    display: block;
}

.ktnbs-chat-close {
    display: none;
}

.ktnbs-chat-button.active .ktnbs-chat-icon {
    display: none;
}

.ktnbs-chat-button.active .ktnbs-chat-close {
    display: block;
}

/* Notification Badge */
.ktnbs-chat-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #ef4444;
    color: white;
    font-size: 13px;
    font-weight: bold;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid white;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Chat Window */
.ktnbs-chat-window {
    position: fixed;
    bottom: 100px;
    right: 20px;
    width: 380px;
    height: 600px;
    background: white;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transform: scale(0.8) translateY(20px);
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.ktnbs-chat-window.active {
    opacity: 1;
    visibility: visible;
    transform: scale(1) translateY(0);
}

/* Maximized State */
.ktnbs-chat-window.maximized {
    width: calc(100vw - 40px);
    height: calc(100vh - 40px);
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border-radius: 16px;
}

/* Smooth transition for maximize */
.ktnbs-chat-window {
    transition: all 0.3s ease, opacity 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55), transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

/* Header */
.ktnbs-chat-header {
    background: #126a99;
    color: white;
    padding: 20px;
    border-radius: 16px 16px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ktnbs-chat-header-content {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ktnbs-chat-avatar {
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ktnbs-chat-avatar svg {
    width: 24px;
    height: 24px;
    fill: white;
}

.ktnbs-chat-header-text h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.ktnbs-chat-status {
    margin: 4px 0 0 0;
    font-size: 13px;
    opacity: 0.9;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ktnbs-status-dot {
    width: 8px;
    height: 8px;
    background: #10b981;
    border-radius: 50%;
    animation: blink 2s infinite;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Header Action Buttons */
.ktnbs-chat-header-actions {
    display: flex;
    gap: 8px;
}

.ktnbs-chat-action-btn {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    position: relative;
}

.ktnbs-chat-action-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

.ktnbs-chat-action-btn:active {
    transform: scale(0.95);
}

.ktnbs-chat-action-btn svg {
    width: 18px;
    height: 18px;
    color: white;
}

/* Minimize Button (legacy support) */
.ktnbs-chat-minimize {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.ktnbs-chat-minimize:hover {
    background: rgba(255, 255, 255, 0.3);
}

.ktnbs-chat-minimize svg {
    width: 20px;
    height: 20px;
    color: white;
}

/* Messages Area */
.ktnbs-chat-messages {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #f9fafb;
}

.ktnbs-chat-messages::-webkit-scrollbar {
    width: 6px;
}

.ktnbs-chat-messages::-webkit-scrollbar-track {
    background: transparent;
}

.ktnbs-chat-messages::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

.ktnbs-chat-messages::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* Message Bubbles */
.ktnbs-message {
    display: flex;
    animation: slideIn 0.3s ease;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ktnbs-message.user {
    justify-content: flex-end;
}

.ktnbs-message.bot {
    justify-content: flex-start;
}

.ktnbs-message-content {
    max-width: 75%;
    padding: 12px 16px;
    border-radius: 12px;
    line-height: 1.6;
    font-size: 15px;
    font-family: 'Prompt', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.ktnbs-message.user .ktnbs-message-content {
    background: #126a99;
    color: white;
    border-bottom-right-radius: 4px;
}

.ktnbs-message.bot .ktnbs-message-content {
    background: white;
    color: #1f2937;
    border-bottom-left-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.ktnbs-message-content strong {
    font-weight: 600;
}

.ktnbs-message-content a {
    color: inherit;
    text-decoration: underline;
}

.ktnbs-message.user .ktnbs-message-content a {
    color: white;
}

.ktnbs-message.bot .ktnbs-message-content a {
    color: #177cb0;
}

/* Typing Indicator */
.ktnbs-typing {
    display: flex;
    gap: 4px;
    padding: 4px 0;
}

.ktnbs-typing span {
    width: 8px;
    height: 8px;
    background: #9ca3af;
    border-radius: 50%;
    animation: typing 1.4s infinite;
}

.ktnbs-typing span:nth-child(2) {
    animation-delay: 0.2s;
}

.ktnbs-typing span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes typing {
    0%, 60%, 100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-10px);
    }
}

/* Quick Actions */
.ktnbs-quick-actions {
    padding: 12px 20px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

.ktnbs-quick-action {
    background: white;
    border: 1px solid #e5e7eb;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
    color: #374151;
    font-family: 'Prompt', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.ktnbs-quick-action:hover {
    background: #177cb0;
    color: white;
    border-color: #177cb0;
    transform: translateY(-1px);
}

/* Input Area */
.ktnbs-chat-input-container {
    background: white;
    border-top: 1px solid #e5e7eb;
    border-radius: 0 0 16px 16px;
}

.ktnbs-chat-form {
    padding: 16px 20px;
    display: flex;
    gap: 8px;
}

.ktnbs-chat-input {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    font-size: 15px;
    outline: none;
    transition: all 0.2s;
    font-family: 'Prompt', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.5;
}

.ktnbs-chat-input:focus {
    border-color: #177cb0;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.ktnbs-chat-send {
    width: 44px;
    height: 44px;
    background: #126a99;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.ktnbs-chat-send:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.ktnbs-chat-send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.ktnbs-chat-send svg {
    width: 20px;
    height: 20px;
    color: white;
}

/* Footer */
.ktnbs-chat-footer {
    padding: 8px 20px 12px;
    text-align: center;
    font-size: 13px;
    color: #9ca3af;
}

.ktnbs-chat-footer strong {
    color: #177cb0;
}

/* Mobile Responsive */
@media (max-width: 480px) {
    .ktnbs-chat-window {
        width: calc(100vw - 20px);
        height: calc(100vh - 120px);
        right: 10px;
        bottom: 90px;
    }
    
    /* Auto-maximize on mobile */
    .ktnbs-chat-window.active {
        width: 100vw;
        height: 100vh;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 0;
    }
    
    .ktnbs-chat-window.maximized {
        border-radius: 0;
    }
    
    #ktnbs-chat-widget {
        bottom: 10px;
        right: 10px;
    }
    
    .ktnbs-message-content {
        max-width: 85%;
    }
    
    /* Hide maximize button on mobile (already fullscreen) */
    #ktnbs-chat-maximize {
        display: none;
    }
}

/* Tablet */
@media (min-width: 481px) and (max-width: 768px) {
    .ktnbs-chat-window {
        width: 450px;
        height: 650px;
    }
    
    .ktnbs-chat-window.maximized {
        width: calc(100vw - 40px);
        height: calc(100vh - 40px);
    }
}

/* Print Styles */
@media print {
    #ktnbs-chat-widget {
        display: none !important;
    }
}