/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 10 2026 | 08:28:06 */
/* Add your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 

:root {
  --teal: #4A9B9B;
  --coral: #E07882;
  --navy: #1E3A4D;
  --light-gray: #F5F5F5;
  --white: #ffffff;
  --text: #333333;
  --text-light: #666666;
}

/* Restores base transitions globally and allows your element styles to work */
html * {
    transition-delay: .0s !important;
    transition-duration: .2s !important;
}


/* HOME */
/* Hero */
#hero {
  background: linear-gradient(135deg, #4A9B9B 0%, #1E3A4D 100%);
  color: white;
  padding: 6rem 5%;
  text-align: center;
  position: relative;
  overflow: hidden;
}

#hero::before {
  content: '';
  position: absolute;
  top: -10%;
  left: 80%;
  width: 500px;
  height: 500px;
  background: rgba(224,120,130,0.1);
  border-radius: 50%;
  pointer-events: none;
}

#hero::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: -5%;
  width: 400px;
  height: 400px;
  background: rgba(74,155,155,0.15);
  border-radius: 50%;
  pointer-events: none;
}


/* Layout Sections */
.section {
    max-width: 1400px;
    margin: 0 auto;
    padding: 5rem 5%;
}

.section-sm {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}

.section-bg {
    background: #F5F5F5;
}

.section-navy {
    background: #1E3A4D;
    color: white;
}

h2.section-title {
    font-size: 2.3rem;
    color: #1E3A4D;
    margin-bottom: 0.75rem;
    text-align: center;
}

.section-navy h2.section-title {
    color: white;
}

.section-subtitle {
    text-align: center;
    color: #666666;
    font-size: 1.1rem;
    max-width: 700px;
    margin: 0 auto 3rem;
    line-height: 1.7;
}

.section-navy .section-subtitle {
    color: rgba(255,255,255,0.75);
}


/* Grids */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }


/* Cards */
.card {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.07);
    transition: transform 0.2s, box-shadow 0.2s;
	min-height: 330px;
}

@media (max-width: 800px) {
  .grid-2, .grid-3 {
    grid-template-columns: 1fr;
  }
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

.card-icon {
    font-size: 2.2rem;
    margin-bottom: 1rem;
}

.card h3 {
    color: #1E3A4D;
    margin-bottom: 0.6rem;
    font-size: 1.15rem;
	font-weight: bold;
}

.card p {
    color: #666666;
    font-size: 0.95rem;
    line-height: 1.6;
}


/* Pillar Card */
.pillar-card {
  background: white;
  border-radius: 12px;
  padding: 2.5rem 2rem;
  box-shadow: 0 4px 15px rgba(0,0,0,0.07);
  transition: transform 0.2s, box-shadow 0.2s;
  border-top: 4px solid #4a9b9b;
  text-align: center;
	min-height: 340px;
}

.pillar-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
}

.pillar-card .icon {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(135deg, #438b8e, #254a5a);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.7rem;
  margin: 0 auto 1.5rem;
}

.pillar-card h3 {
  color: #1e3a4d;
  margin-bottom: 0.75rem;
  font-size: 1.1rem;
	font-weight: bold;
}

.pillar-card p {
  color: #666666;
  font-size: 0.9rem;
  line-height: 1.6;
}


/* Workflow */
.workflow {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    margin: 2rem 0;
    gap: 0;
}

.workflow-step {
    text-align: center;
    padding: 1.5rem 1rem;
    flex: 1;
    min-width: 140px;
}

.workflow-step .step-circle {
    width: 76px; height: 76px;
    border-radius: 50%;
    background: linear-gradient(135deg, #438b8e, #254a5a);
    color: white;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem;
    margin: 0 auto 1rem;
    box-shadow: 0 4px 15px rgba(74,155,155,0.3);
}

.workflow-step h4 {
    color: #1e3a4d;
    font-size: 1rem;
    margin-bottom: 0.3rem;
	font-weight: bold;
}

.workflow-step p {
    font-size: 0.82rem;
    color: #666666;
    line-height: 1.4;
}

.workflow-arrow {
    font-size: 1.4rem;
    color: #4a9b9b;
    padding: 0 0.2rem;
    padding-top: 3.2rem;
    flex-shrink: 0;
}

@media (max-width: 800px) {  .workflow {
    flex-direction: column;
    align-items: center;
  }
	
  .workflow-arrow {
    transform: rotate(90deg);
    padding-top: 0;
  }
}


/* Industry Grid */
.industry-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.industry-card {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0,0,0,0.07);
    border-left: 4px solid #E07882;
    transition: transform 0.2s;
}

.industry-card:hover { transform: translateY(-4px); }

.industry-card h4 {
    color: #1E3A4D;
    margin-bottom: 0.4rem;
    font-size: 1rem;
}

.industry-card p {
    font-size: 0.85rem;
    color: #666666;
}


/* Feature list card */
.feature-card {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.07);
    border-left: 4px solid #4A9B9B;
}

.feature-card h3 {
    color: #1E3A4D;
    margin-bottom: 1rem;
	font-size: 1.1rem;
	font-weight: bold;
}

.feature-card ul {
    list-style: none;
    padding: 0;
}

.feature-card ul li {
    padding: 0.35rem 0;
    color: #666666;
    font-size: 0.9rem;
}

.feature-card ul li::before {
    content: '→ ';
    color: #4A9B9B;
    font-weight: bold;
}


/* Nav page cards (solutions hub) */
.nav-page-card {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 4px 15px rgba(0,0,0,0.07) !important;
    text-decoration: none !important;
    display: block;
    border: 2px solid transparent;
    transition: border-color 0.2s, transform 0.15s, box-shadow 0.2s;
}
.nav-page-card:hover {
    border-color: #4A9B9B;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(74,155,155,0.13);
}
.nav-page-icon { font-size: 2.5rem; margin-bottom: 0.75rem; }
.nav-page-card h3 { color: #1E3A4D; font-size: 1.1rem; margin-bottom: 0.5rem; font-weight: bold; }
.nav-page-card p { color: #666666; font-size: 0.9rem; line-height: 1.6; margin-bottom: 1rem; }
.nav-page-link { color: #4A9B9B; font-weight: 600; font-size: 0.9rem; }


/* In-progress notice banner */
.notice-banner {
    background: #fff8e6;
    border: 2px solid #e8a800;
    border-radius: 12px;
    padding: 1.75rem 2rem;
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
}
.notice-icon { font-size: 2rem; flex-shrink: 0; line-height: 1; margin-top: 0.1rem; }
.notice-banner h4 { color: #6b4600; margin-bottom: 0.4rem; font-size: 1rem; font-weight: bold;}
.notice-banner p { font-size: 0.9rem; color: #5a3d00; line-height: 1.6; margin-bottom: 0.5rem; }
.notice-banner ul { list-style: disc; padding-left: 1.25rem; font-size: 0.88rem; color: #5a3d00; line-height: 1.9; }


/* Step guide (shared, also used in lab.html) */
.step-list { counter-reset: step; list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2rem; }
.step-item { display: grid; grid-template-columns: 56px 1fr; gap: 1.5rem; align-items: start; }
.step-num { width: 56px; height: 56px; border-radius: 50%; background: #4A9B9B; color: white; font-size: 1.4rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.step-body h3 { color: #1E3A4D; font-size: 1.15rem; margin-bottom: 0.4rem; font-weight: bold; }
.step-body p { color: #666666; font-size: 0.93rem; line-height: 1.65; margin-bottom: 0.5rem; }


 /* ── Launch banner ── */
        .launch-banner {
            background: linear-gradient(135deg, #4A9B9B, #2d7a7a);
            padding: 3rem 2rem;
            text-align: center;
        }
        .launch-banner h2 {
            color: white;
            font-size: 1.8rem;
            margin-bottom: 0.5rem;
        }
        .launch-banner p {
            color: rgba(255,255,255,0.85);
            font-size: 1.05rem;
            margin-bottom: 1.75rem;
            max-width: 560px;
            margin-left: auto;
            margin-right: auto;
        }
        .launch-btn {
            display: inline-flex;
            align-items: center;
            gap: 0.6rem;
            background: white;
            color: #4A9B9B;
            font-weight: 700;
            font-size: 1.1rem;
            padding: 0.85rem 2.2rem;
            border-radius: 50px;
            text-decoration: none;
            box-shadow: 0 6px 24px rgba(0,0,0,0.2);
            transition: transform 0.15s, box-shadow 0.15s;
        }
        .launch-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 32px rgba(0,0,0,0.25);
        }
        .launch-btn-arrow {
            font-size: 1.3rem;
        }

        /* ── Step guide ── */
        .step-list {
            counter-reset: step;
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }
        .step-item {
            display: grid;
            grid-template-columns: 56px 1fr;
            gap: 1.5rem;
            align-items: start;
        }
        .step-num {
            counter-increment: step;
            width: 56px;
            height: 56px;
            border-radius: 50%;
            background: #4A9B9B;
            color: white;
            font-size: 1.4rem;
            font-weight: 700;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .step-body h3 {
            color: var(--navy);
            font-size: 1.15rem;
            margin-bottom: 0.4rem;
        }
        .step-body p {
            color: var(--text-light);
            font-size: 0.93rem;
            line-height: 1.65;
            margin-bottom: 0.5rem;
        }
        .step-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 0.4rem;
            margin-top: 0.5rem;
        }
        .step-tag {
            font-size: 0.78rem;
            background: var(--light-gray);
            color: var(--navy);
            padding: 0.2rem 0.65rem;
            border-radius: 50px;
            font-weight: 600;
        }
        .step-tag-teal {
            background: rgba(74,155,155,0.12);
            color: #4A9B9B;
        }

        /* ── Feature grid ── */
        .feature-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1.5rem;
        }
        .feature-box {
            background: white;
            border-radius: 12px;
            padding: 1.75rem;
            box-shadow: 0 3px 12px rgba(0,0,0,0.07);
            border-top: 3px solid #4A9B9B;
        }
        .feature-box h4 {
            color: var(--navy);
            font-size: 1rem;
            margin-bottom: 0.75rem;
        }
        .feature-box ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        .feature-box ul li {
            font-size: 0.88rem;
            color: var(--text);
            padding: 0.3rem 0;
            border-bottom: 1px solid #f2f2f2;
            line-height: 1.5;
        }
        .feature-box ul li:last-child { border-bottom: none; }
        .feature-box ul li::before {
            content: '✓ ';
            color: #4A9B9B;
            font-weight: bold;
        }

        @media (max-width: 700px) {
            .step-item { grid-template-columns: 44px 1fr; }
            .step-num { width: 44px; height: 44px; font-size: 1.1rem; }
            .feature-row { grid-template-columns: 1fr; }
        }


/* Team cards */
.team-card {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: transform 0.2s;
	min-height: 400px;
}

.team-card:hover { transform: translateY(-5px); }

.team-photo {
    width: 110px !important;
    height: 110px !important;
    object-fit: cover;
    object-position: top center;
    border-radius: 50% !important;
    display: block;
    margin: 1.75rem auto 0;
    border: 3px solid var(--light-gray) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}

.team-photo-placeholder {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal), var(--navy));
    display: flex; align-items: center; justify-content: center;
    font-size: 2rem;
    color: white;
    margin: 1.75rem auto 0;
}

.team-content { padding: 1.25rem 1.5rem 1.5rem; text-align: center; }

.team-content h4 {
    color: var(--teal);
    font-size: 1.15rem;
    margin-bottom: 0.3rem;
}

.team-content .role {
    color: var(--coral);
    font-style: italic;
    font-weight: 600;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.team-content .credentials {
    font-size: 0.82rem;
    color: var(--text-light);
    margin-bottom: 0.75rem;
}

.team-content p {
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--text);
}


/* Mission box */
.mission-box {
    background: var(--light-gray);
    padding: 2.5rem;
    border-radius: 12px;
    border-left: 5px solid var(--coral);
}

/* Credibility bar */
.credibility-bar {
    display: flex;
    gap: 3rem;
    justify-content: center;
    flex-wrap: wrap;
    padding: 2.5rem 5%;
    background: var(--navy);
    margin-top: 0;
}

.cred-item {
    text-align: center;
    color: white;
}

.cred-item .cred-number {
    font-size: 2.2rem;
    font-weight: bold;
    color: var(--teal);
    display: block;
    line-height: 1;
    margin-bottom: 0.3rem;
}

.cred-item .cred-label {
    font-size: 0.85rem;
    opacity: 0.8;
}


/* Info box */
.info-box {
    background: var(--light-gray);
    border-left: 5px solid var(--teal);
    padding: 1.5rem 2rem;
    border-radius: 0 10px 10px 0;
    margin: 2rem 0;
}

.info-box h4 { color: var(--navy); margin-bottom: 0.5rem; font-weight: bold; font-size: 1.2rem;}
.info-box p { color: var(--text-light); font-size: 0.95rem; line-height: 1.6; }


/* Contact Form */
.cf7-two-col {
  display: flex;
  gap: 20px;
}
.cf7-col-left, .cf7-col-right {
  flex: 1;
}
@media (max-width: 768px) {
  .cf7-two-col {
    flex-direction: column;
    gap: 0;
  }
}

/* Change Contact Form 7 dropdown background to white */
.wpcf7-select {
    background-color: #ffffff !important;
    color: #666666 !important;
    padding-right: 30px !important; /* Space for the arrow */
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23666666%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%2E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px top 50% !important;
    background-size: 12px auto !important;
	font-size: 0.9rem;
	padding: 11px;
}


/* Change border color of CF7 inputs and textareas when active */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="url"]:focus,
.wpcf7 input[type="number"]:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
    border-color: #4A9B9B !important; /* Change this hex code to your preferred active color */
    outline: none !important;          /* Removes the default browser blue outline ring */
    box-shadow: 0 0 5px rgba(0, 115, 170, 0.3) !important; /* Optional: adds a subtle outer glow matching your color */
}


/* ── Tier table ── */
.tier-table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
    font-size: 0.95rem;
}

.tier-table th {
    background: var(--navy);
    color: white;
    padding: 1rem 1.5rem;
    text-align: left;
    font-weight: 600;
}

.tier-table td {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #e8e8e8;
    vertical-align: top;
}

.tier-table tr:nth-child(even) td {
    background: var(--light-gray);
}

.tier-badge {
    display: inline-block;
    background: var(--teal);
    color: white;
    padding: 0.2rem 0.7rem;
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
}

/* ── Case study cards ── */
.case-study-card {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: transform 0.2s;
}

.case-study-card:hover { transform: translateY(-4px); }

.case-study-image {
    height: 200px;
    background: linear-gradient(135deg, var(--teal), var(--navy));
    display: flex; align-items: center; justify-content: center;
    font-size: 3rem;
}

.case-study-content { padding: 1.5rem; }

.case-study-badge {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.2rem 0.6rem;
    border-radius: 50px;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.badge-feasibility { background: #FFF3CD; color: #856404; }
.badge-pilot { background: #D1ECF1; color: #0C5460; }
.badge-validated { background: #D4EDDA; color: #155724; }
.badge-operational { background: #CCE5FF; color: #004085; }

.case-study-content h3 {
    color: var(--navy);
    margin-bottom: 0.5rem;
    font-size: 1.05rem;
}

.case-study-content p {
    color: var(--text-light);
    font-size: 0.9rem;
    line-height: 1.5;
}


/* ── Jump nav ── */

.jump-nav {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	justify-content: center;
}

.jump-nav a {
  text-decoration: none;
}

.jump-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.6rem;
	text-decoration: none;
	width: 130px;
	text-align: center;
	padding: 0.75rem;
	border-radius: 10px;
	border: 2px solid transparent;
	transition: border-color 0.2s, transform 0.15s, box-shadow 0.2s;
}

.jump-card:hover {
	border-color: var(--teal);
	transform: translateY(-3px);
	box-shadow: 0 6px 18px rgba(74,155,155,0.15);
}

.jump-img {
	width: 100%;
	height: 72px !important;
	object-fit: cover;
	border-radius: 7px !important;
}

.jump-img-placeholder {
	width: 100%;
	height: 72px;
	border-radius: 7px;
	background: var(--light-gray);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
}
.jump-info p {
	font-size: 0.8rem;
	color: var(--navy);
	font-weight: 600;
	margin: 0.25rem 0 0;
	line-height: 1.3;
}

.jump-card-dev { opacity: 0.75; }

.cs-detail {
	scroll-margin-top: 120px; /* Space reserved for a fixed header */
}

.cs-hero-image {
	width: 100%;
	height: 320px !important;
	object-fit: cover;
	object-position: 50% 70%;
	display: block;
}

.cs-body {
	padding: 2.5rem;
}

.cs-meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-bottom: 1.25rem;
}

.cs-industry {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--text-light);
	background: var(--light-gray);
	padding: 0.2rem 0.75rem;
	border-radius: 50px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.cs-body h2 {
	font-size: 1.6rem;
	color: var(--navy);
	margin-bottom: 1rem;
	text-align: left;
	font-weight: bold;
}

.cs-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-top: 1.5rem;
}

.cs-block h4 {
	color: var(--teal);
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin-bottom: 0.75rem;
	font-weight: bold;
}

.cs-block p {
	font-size: 0.95rem;
	color: var(--text);
	line-height: 1.65;
	margin-bottom: 0.5rem;
}

.cs-block ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.cs-block ul li {
	padding: 0.35rem 0;
	font-size: 0.92rem;
	color: var(--text);
	border-bottom: 1px solid #f2f2f2;
	line-height: 1.5;
}

.cs-block ul li:last-child { border-bottom: none; }

.cs-block ul li::before {
	content: '→ ';
	color: var(--teal);
	font-weight: bold;
}

.cs-result {
	background: linear-gradient(135deg, #f0f9f9, #e8f4f4);
	border: 1px solid rgba(74,155,155,0.2);
	border-radius: 10px;
	padding: 1.25rem 1.5rem;
	margin-top: 1.5rem;
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}

.cs-result-icon {
	font-size: 1.5rem;
	flex-shrink: 0;
	margin-top: 0.1rem;
}

.cs-result p {
	font-size: 0.95rem;
	color: var(--navy);
	line-height: 1.6;
	font-weight: 500;
}

/* Sustainability section */
.sustain-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 2rem;
}

.sustain-card {
	background: white;
	border-radius: 10px;
	padding: 1.75rem;
	box-shadow: 0 3px 12px rgba(0,0,0,0.07);
	border-top: 3px solid var(--teal);
}

.sustain-card h4 {
	color: var(--navy);
	margin-bottom: 0.6rem;
	font-size: 1rem;
	font-weight: bold;
}

.sustain-card p {
	font-size: 0.88rem;
	color: var(--text-light);
	line-height: 1.6;
}

/* In-development cards */
.dev-card {
	background: white;
	border-radius: 12px;
	padding: 2rem;
	box-shadow: 0 4px 15px rgba(0,0,0,0.07);
	border-left: 4px solid var(--coral);
	opacity: 0.85;
}

.dev-card h3 {
	color: var(--navy);
	font-size: 1.05rem;
	margin-bottom: 0.5rem;
	font-weight: bold;
}

.dev-card p {
	font-size: 0.88rem;
	color: var(--text-light);
	line-height: 1.6;
	margin-bottom: 0.75rem;
}

@media (max-width: 800px) {
	.cs-grid { grid-template-columns: 1fr; }
	.cs-hero-image { height: 220px; }
	.sustain-grid { grid-template-columns: 1fr; }
}



/* Remove category links from blog posts */
.premium-blog-cats-container ul.post-categories li a {
    pointer-events: none; /* Disables clicking */
    cursor: default;       /* Removes the pointer hand icon */
    color: inherit;        /* Keeps the text color from shifting */
    text-decoration: none; /* Removes underlines if present */
}



/* Case Studies */

@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial,
    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-200: oklch(92.4% 0.12 95.746);
    --color-amber-500: oklch(76.9% 0.188 70.08);
    --color-amber-600: oklch(66.6% 0.179 58.318);
    --color-amber-700: oklch(55.5% 0.163 48.998);
    --color-amber-800: oklch(47.3% 0.137 46.201);
    --color-amber-900: oklch(41.4% 0.112 45.904);
    --color-amber-950: oklch(27.9% 0.077 45.635);
    --color-emerald-50: oklch(97.9% 0.021 166.113);
    --color-emerald-100: oklch(95% 0.052 163.051);
    --color-emerald-200: oklch(90.5% 0.093 164.15);
    --color-emerald-300: oklch(84.5% 0.143 164.978);
    --color-emerald-400: oklch(76.5% 0.177 163.223);
    --color-emerald-600: oklch(59.6% 0.145 163.225);
    --color-emerald-700: oklch(50.8% 0.118 165.612);
    --color-emerald-800: oklch(43.2% 0.095 166.913);
    --color-emerald-900: oklch(37.8% 0.077 168.94);
    --color-teal-50: oklch(98.4% 0.014 180.72);
    --color-teal-600: oklch(60% 0.118 184.704);
    --color-blue-100: oklch(93.2% 0.032 255.585);
    --color-blue-500: oklch(62.3% 0.214 259.815);
    --color-blue-600: oklch(54.6% 0.245 262.881);
    --color-blue-700: oklch(48.8% 0.243 264.376);
    --color-blue-800: oklch(42.4% 0.199 265.638);
    --color-blue-900: oklch(37.9% 0.146 265.522);
    --color-blue-950: oklch(28.2% 0.091 267.935);
    --color-indigo-50: oklch(96.2% 0.018 272.314);
    --color-indigo-100: oklch(93% 0.034 272.788);
    --color-indigo-200: oklch(87% 0.065 274.039);
    --color-indigo-300: oklch(78.5% 0.115 274.713);
    --color-indigo-400: oklch(67.3% 0.182 276.935);
    --color-indigo-500: oklch(58.5% 0.233 277.117);
    --color-indigo-600: oklch(51.1% 0.262 276.966);
    --color-indigo-700: oklch(45.7% 0.24 277.023);
    --color-indigo-800: oklch(39.8% 0.195 277.366);
    --color-indigo-900: oklch(35.9% 0.144 278.697);
    --color-indigo-950: oklch(25.7% 0.09 281.288);
    --color-rose-50: oklch(96.9% 0.015 12.422);
    --color-rose-100: oklch(94.1% 0.03 12.58);
    --color-rose-200: oklch(89.2% 0.058 10.001);
    --color-rose-300: oklch(81% 0.117 11.638);
    --color-rose-500: oklch(64.5% 0.246 16.439);
    --color-rose-600: oklch(58.6% 0.253 17.585);
    --color-rose-700: oklch(51.4% 0.222 16.935);
    --color-rose-800: oklch(45.5% 0.188 13.697);
    --color-rose-900: oklch(41% 0.159 10.272);
    --color-slate-50: oklch(98.4% 0.003 247.858);
    --color-slate-100: oklch(96.8% 0.007 247.896);
    --color-slate-200: oklch(92.9% 0.013 255.508);
    --color-slate-300: oklch(86.9% 0.022 252.894);
    --color-slate-400: oklch(70.4% 0.04 256.788);
    --color-slate-500: oklch(55.4% 0.046 257.417);
    --color-slate-600: oklch(44.6% 0.043 257.281);
    --color-slate-700: oklch(37.2% 0.044 257.287);
    --color-slate-800: oklch(27.9% 0.041 260.031);
    --color-slate-900: oklch(20.8% 0.042 265.755);
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-5xl: 64rem;
    --container-7xl: 80rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-tight: -0.025em;
    --tracking-wider: 0.05em;
    --tracking-widest: 0.1em;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-relaxed: 1.625;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);
    --animate-spin: spin 1s linear infinite;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji');
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace) !important;
    font-feature-settings: var(--default-mono-font-feature-settings, normal) !important;
    font-variation-settings: var(--default-mono-font-variation-settings, normal) !important;
    font-size: 1em !important;
  }
  small {
    font-size: 80%;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.5em;
  }

  table.cstudy {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol, ul, menu {
    list-style: none;
  }
  img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentcolor;
      @supports (color: color-mix(in lab, red, red)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden='until-found'])) {
    display: none;
  }
}
@layer utilities {
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
  .top-0 {
    top: 0px;
  }
  .right-0 {
    right: 0px;
  }
  .right-5 {
    right: calc(var(--spacing) * 5) !important;
  }
  .bottom-5 {
    bottom: calc(var(--spacing) * 5) !important;
  }
  .left-0 {
    left: 0px !important;
  }
  .z-50 {
    z-index: 50 !important;
  }
  .mx-auto {
    margin-inline: auto !important;
  }
  .my-1 {
    margin-block: var(--spacing) !important;
  }
  .my-6 {
    margin-block: calc(var(--spacing) * 6) !important;
  }
  .mt-0\.5 {
    margin-top: calc(var(--spacing) * 0.5) !important;
  }
  .mt-1 {
    margin-top: var(--spacing) !important;
  }
  .mt-1\.5 {
    margin-top: calc(var(--spacing) * 1.5) !important;
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2) !important;
  }
  .mt-2\.5 {
    margin-top: calc(var(--spacing) * 2.5) !important;
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3) !important;
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4) !important;
  }
  .mt-6 {
    margin-top: calc(var(--spacing) * 6) !important;
  }
  .mt-8 {
    margin-top: calc(var(--spacing) * 8) !important;
  }
  .mt-12 {
    margin-top: calc(var(--spacing) * 12) !important;
  }
  .mt-auto {
    margin-top: auto !important;
  }
  .mb-1 {
    margin-bottom: var(--spacing) !important;
  }
  .mb-1\.5 {
    margin-bottom: calc(var(--spacing) * 1.5) !important;
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2) !important;
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3) !important;
  }
  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4) !important;
  }
  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6) !important;
  }
  .mb-8 {
    margin-bottom: calc(var(--spacing) * 8) !important;
  }
  .block {
    display: block !important;
  }
  .flex {
    display: flex !important;
  }
  .grid {
    display: grid !important;
  }
  .hidden {
    display: none !important;
  }
  .inline-block {
    display: inline-block !important;
  }
  .h-0\.5 {
    height: calc(var(--spacing) * 0.5) !important;
  }
  .h-1\/2 {
    height: calc(1 / 2 * 100%) !important;
  }
  .h-2 {
    height: calc(var(--spacing) * 2) !important;
  }
  .h-2\.5 {
    height: calc(var(--spacing) * 2.5) !important;
  }
  .h-3 {
    height: calc(var(--spacing) * 3) !important;
  }
  .h-5 {
    height: calc(var(--spacing) * 5) !important;
  }
  .h-12 {
    height: calc(var(--spacing) * 12) !important;
  }
  .h-16 {
    height: calc(var(--spacing) * 16) !important;
  }
  .h-40 {
    height: calc(var(--spacing) * 40) !important;
  }
  .h-\[320px\] {
    height: 320px !important;
  }
  .h-\[360px\] {
    height: 360px !important;
  }
  .h-\[420px\] {
    height: 420px !important;
  }
  .min-h-screen {
    min-height: 100vh !important;
  }
  .w-2 {
    width: calc(var(--spacing) * 2) !important;
  }
  .w-5 {
    width: calc(var(--spacing) * 5) !important;
  }
  .w-8 {
    width: calc(var(--spacing) * 8) !important;
  }
  .w-10 {
    width: calc(var(--spacing) * 10) !important;
  }
  .w-12 {
    width: calc(var(--spacing) * 12) !important;
  }
  .w-24 {
    width: calc(var(--spacing) * 24) !important;
  }
  .w-full {
    width: 100% !important;
  }
  .max-w-5xl {
    max-width: var(--container-5xl) !important;
  }
  .max-w-7xl {
    max-width: var(--container-7xl) !important;
  }
  .min-w-full {
    min-width: 100% !important;
  }
  .flex-1 {
    flex: 1;
  }
  .flex-grow {
    flex-grow: 1;
  }
  .animate-spin {
    animation: var(--animate-spin) !important;
  }
  .cursor-pointer {
    cursor: pointer !important;
  }
  .list-inside {
    list-style-position: inside !important;
  }
  .list-disc {
    list-style-type: disc !important;
  }
  .appearance-none {
    appearance: none !important;
  }
  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .flex-col {
    flex-direction: column !important;
  }
  .flex-wrap {
    flex-wrap: wrap !important;
  }
  .items-center {
    align-items: center !important;
  }
  .items-start {
    align-items: flex-start !important;
  }
  .justify-around {
    justify-content: space-around !important;
  }
  .justify-between {
    justify-content: space-between !important;
  }
  .justify-center {
    justify-content: center !important;
  }
  .gap-1 {
    gap: var(--spacing) !important;
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5) !important;
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2) !important;
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5) !important;
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3) !important;
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4) !important;
  }
  .gap-5 {
    gap: calc(var(--spacing) * 5) !important;
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6) !important;
  }
  .gap-8 {
    gap: calc(var(--spacing) * 8) !important;
  }
  :where(.space-y-1 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-y-1\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }
  :where(.space-y-4 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-y-6 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-y-8 > :not(:last-child)) {
    --tw-space-y-reverse: 0 !important;
    margin-block-start: calc(calc(var(--spacing) * 8) * var(--tw-space-y-reverse)) !important;
    margin-block-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-y-reverse))) !important;
  }
  :where(.space-x-2 > :not(:last-child)) {
    --tw-space-x-reverse: 0 !important;
    margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse)) !important;
    margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse))) !important;
  }
  :where(.space-x-3 > :not(:last-child)) {
    --tw-space-x-reverse: 0 !important;
    margin-inline-start: calc(calc(var(--spacing) * 3) * var(--tw-space-x-reverse)) !important;
    margin-inline-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-x-reverse))) !important;
  }
  :where(.space-x-4 > :not(:last-child)) {
    --tw-space-x-reverse: 0 !important;
    margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)) !important;
    margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))) !important;
  }
  :where(.divide-y > :not(:last-child)) {
    --tw-divide-y-reverse: 0 !important;
    border-bottom-style: var(--tw-border-style) !important;
    border-top-style: var(--tw-border-style) !important;
    border-top-width: calc(1px * var(--tw-divide-y-reverse)) !important;
    border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))) !important;
  }
  :where(.divide-slate-200 > :not(:last-child)) {
    border-color: var(--color-slate-200) !important;
  }
  .overflow-hidden {
    overflow: hidden !important;
  }
  .overflow-x-auto {
    overflow-x: auto !important;
  }
  .rounded {
    border-radius: 0.25rem !important;
  }
  .rounded-2xl {
    border-radius: var(--radius-2xl) !important;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px) !important;
  }
  .rounded-lg {
    border-radius: var(--radius-lg) !important;
  }
  .rounded-md {
    border-radius: var(--radius-md) !important;
  }
  .rounded-xl {
    border-radius: var(--radius-xl) !important;
  }
  .rounded-l-md {
    border-top-left-radius: var(--radius-md) !important;
    border-bottom-left-radius: var(--radius-md) !important;
  }
  .rounded-r-lg {
    border-top-right-radius: var(--radius-lg) !important;
    border-bottom-right-radius: var(--radius-lg) !important;
  }
  .rounded-r-md {
    border-top-right-radius: var(--radius-md) !important;
    border-bottom-right-radius: var(--radius-md) !important;
  }
  .rounded-r-xl {
    border-top-right-radius: var(--radius-xl) !important;
    border-bottom-right-radius: var(--radius-xl) !important;
  }
  .border {
    border-style: var(--tw-border-style) !important;
    border-width: 1px !important;
  }
  .border-2 {
    border-style: var(--tw-border-style) !important;
    border-width: 2px !important;
  }
  .border-4 {
    border-style: var(--tw-border-style) !important;
    border-width: 4px !important;
  }
  .border-t {
    border-top-style: var(--tw-border-style) !important;
    border-top-width: 1px !important;
  }
  .border-r {
    border-right-style: var(--tw-border-style) !important;
    border-right-width: 1px !important;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style) !important;
    border-bottom-width: 1px !important;
  }
  .border-b-2 {
    border-bottom-style: var(--tw-border-style) !important;
    border-bottom-width: 2px !important;
  }
  .border-l-4 {
    border-left-style: var(--tw-border-style) !important;
    border-left-width: 4px !important;
  }
  .border-amber-200 {
    border-color: var(--color-amber-200) !important;
  }
  .border-emerald-100 {
    border-color: var(--color-emerald-100) !important;
  }
  .border-emerald-200 {
    border-color: var(--color-emerald-200) !important;
  }
  .border-indigo-100 {
    border-color: var(--color-indigo-100) !important;
  }
  .border-indigo-500 {
    border-color: var(--color-indigo-500) !important;
  }
  .border-rose-100 {
    border-color: var(--color-rose-100) !important;
  }
  .border-rose-200 {
    border-color: var(--color-rose-200) !important;
  }
  .border-slate-100 {
    border-color: var(--color-slate-100) !important;
  }
  .border-slate-200 {
    border-color: var(--color-slate-200) !important;
  }
  .border-slate-300 {
    border-color: var(--color-slate-300) !important;
  }
  .border-slate-400 {
    border-color: var(--color-slate-400) !important;
  }
  .border-slate-800 {
    border-color: var(--color-slate-800) !important;
  }
  .border-transparent {
    border-color: transparent !important;
  }
  .bg-amber-50 {
    background-color: var(--color-amber-50) !important;
  }
  .bg-amber-200 {
    background-color: var(--color-amber-200) !important;
  }
  .bg-amber-50\/50 {
    background-color: color-mix(in srgb, oklch(98.7% 0.022 95.277) 50%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-amber-50) 50%, transparent);
    }
  }
  .bg-blue-100 {
    background-color: var(--color-blue-100) !important;
  }
  .bg-emerald-50 {
    background-color: var(--color-emerald-50) !important;
  }
  .bg-emerald-50\/50 {
    background-color: color-mix(in srgb, oklch(97.9% 0.021 166.113) 50%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-emerald-50) 50%, transparent) !important;
    }
  }
  .bg-emerald-100 {
    background-color: var(--color-emerald-100) !important;
  }
  .bg-emerald-600 {
    background-color: var(--color-emerald-600) !important;
  }
  .bg-indigo-50 {
    background-color: var(--color-indigo-50) !important;
  }
  .bg-indigo-50\/50 {
    background-color: color-mix(in srgb, oklch(96.2% 0.018 272.314) 50%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-indigo-50) 50%, transparent) !important;
    }
  }
  .bg-indigo-100 {
    background-color: var(--color-indigo-100) !important;
  }
  .bg-indigo-200 {
    background-color: var(--color-indigo-200) !important;
  }
  .bg-indigo-300 {
    background-color: var(--color-indigo-300) !important;
  }
  .bg-indigo-400 {
    background-color: var(--color-indigo-400) !important;
  }
  .bg-indigo-500 {
    background-color: var(--color-indigo-500) !important;
  }
  .bg-indigo-600 {
    background-color: var(--color-indigo-600) !important;
  }
  .bg-indigo-700 {
    background-color: var(--color-indigo-700) !important;
  }
  .bg-indigo-800 {
    background-color: var(--color-indigo-800) !important;
  }
  .bg-indigo-900 {
    background-color: var(--color-indigo-900) !important;
  }
  .bg-indigo-900\/40 {
    background-color: color-mix(in srgb, oklch(35.9% 0.144 278.697) 40%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-indigo-900) 40%, transparent) !important;
    }
  }
  .bg-indigo-950 {
    background-color: var(--color-indigo-950) !important;
  }
  .bg-rose-50 {
    background-color: var(--color-rose-50) !important;
  }
  .bg-rose-50\/50 {
    background-color: color-mix(in srgb, oklch(96.9% 0.015 12.422) 50%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-rose-50) 50%, transparent) !important;
    }
  }
  .bg-rose-100 {
    background-color: var(--color-rose-100) !important;
  }
  .bg-rose-500\/50 {
    background-color: color-mix(in srgb, oklch(64.5% 0.246 16.439) 50%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-rose-500) 50%, transparent) !important;
    }
  }
  .bg-rose-600 {
    background-color: var(--color-rose-600) !important;
  }
  .bg-slate-50 {
    background-color: var(--color-slate-50) !important;
  }
  .bg-slate-100 {
    background-color: var(--color-slate-100) !important;
  }
  .bg-slate-200 {
    background-color: var(--color-slate-200) !important;
  }
  .bg-slate-900 {
    background-color: var(--color-slate-900) !important;
  }
  .bg-teal-50 {
    background-color: var(--color-teal-50) !important;
  }
  .bg-white {
    background-color: var(--color-white) !important;
  }
  .bg-white\/80 {
    background-color: color-mix(in srgb, #fff 80%, transparent) !important;
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 80%, transparent) !important;
    }
  }
  .bg-gradient-to-r {
    --tw-gradient-position: to right in oklab !important;
    background-image: linear-gradient(var(--tw-gradient-stops)) !important;
  }
  .from-indigo-600 {
    --tw-gradient-from: var(--color-indigo-600) !important;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;
  }
  .to-indigo-800 {
    --tw-gradient-to: var(--color-indigo-800) !important;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)) !important;
  }
  .from-indigo-900 {
    --tw-gradient-from: var(--color-indigo-900);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .to-slate-900 {
    --tw-gradient-to: var(--color-slate-900);
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }
  .p-1\.5 {
    padding: calc(var(--spacing) * 1.5) !important;
  }
  .p-2 {
    padding: calc(var(--spacing) * 2) !important;
  }
  .p-2\.5 {
    padding: calc(var(--spacing) * 2.5) !important;
  }
  .p-3 {
    padding: calc(var(--spacing) * 3) !important;
  }
  .p-4 {
    padding: calc(var(--spacing) * 4) !important;
  }
  .p-5 {
    padding: calc(var(--spacing) * 5) !important;
  }
  .p-6 {
    padding: calc(var(--spacing) * 6) !important;
  }
  .p-8 {
    padding: calc(var(--spacing) * 8) !important;
  }
  .px-1 {
    padding-inline: var(--spacing) !important;
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2) !important;
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5) !important;
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3) !important;
  }
  .px-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5) !important;
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4) !important;
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6) !important;
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5) !important;
  }
  .py-1 {
    padding-block: var(--spacing) !important;
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5) !important;
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2) !important;
  }
  .py-2\.5 {
    padding-block: calc(var(--spacing) * 2.5) !important;
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3) !important;
  }
  .py-3\.5 {
    padding-block: calc(var(--spacing) * 3.5) !important;
  }
  .py-4 {
    padding-block: calc(var(--spacing) * 4) !important;
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6) !important;
  }
  .py-8 {
    padding-block: calc(var(--spacing) * 8) !important;
  }
  .pt-2 {
    padding-top: calc(var(--spacing) * 2) !important;
  }
  .pt-4 {
    padding-top: calc(var(--spacing) * 4) !important;
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6) !important;
  }
  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2) !important;
  }
  .pl-4 {
    padding-left: calc(var(--spacing) * 4) !important;
  }
  .text-center {
    text-align: center !important;
  }
  .text-left {
    text-align: left !important;
  }
  .text-right {
    text-align: right !important;
  }
  .font-mono {
    font-family: var(--font-mono) !important;
  }
  .font-sans {
    font-family: var(--font-sans) !important;
  }
  .text-2xl {
    font-size: var(--text-2xl) !important;
    line-height: var(--tw-leading, var(--text-2xl--line-height)) !important;
  }
  .text-base {
    font-size: var(--text-base) !important;
    line-height: var(--tw-leading, var(--text-base--line-height)) !important;
  }
  .text-lg {
    font-size: var(--text-lg) !important;
    line-height: var(--tw-leading, var(--text-lg--line-height)) !important;
  }
  .text-sm {
    font-size: var(--text-sm) !important;
    line-height: var(--tw-leading, var(--text-sm--line-height)) !important;
  }
  .text-xl {
    font-size: var(--text-xl) !important;
    line-height: var(--tw-leading, var(--text-xl--line-height)) !important;
  }
  .text-xs {
    font-size: var(--text-xs) !important;
    line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
  }
  .text-\[8px\] {
    font-size: 8px !important;
  }
  .text-\[9px\] {
    font-size: 9px !important;
  }
  .text-\[10px\] {
    font-size: 10px !important;
  }
  .text-\[11px\] {
    font-size: 11px !important;
  }
  .leading-relaxed {
    --tw-leading: var(--leading-relaxed) !important;
    line-height: var(--leading-relaxed) !important;
  }
  .leading-snug {
    --tw-leading: var(--leading-snug) !important;
    line-height: var(--leading-snug);
  }
  .leading-tight {
    --tw-leading: var(--leading-tight) !important;
    line-height: var(--leading-tight) !important;
  }
  .font-bold {
    --tw-font-weight: var(--font-weight-bold) !important;
    font-weight: var(--font-weight-bold) !important;
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium) !important;
    font-weight: var(--font-weight-medium) !important;
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold) !important;
    font-weight: var(--font-weight-semibold) !important;
  }
  .tracking-tight {
    --tw-tracking: var(--tracking-tight) !important;
    letter-spacing: var(--tracking-tight) !important;
  }
  .tracking-wider {
    --tw-tracking: var(--tracking-wider) !important;
    letter-spacing: var(--tracking-wider) !important;
  }
  .tracking-widest {
    --tw-tracking: var(--tracking-widest) !important;
    letter-spacing: var(--tracking-widest) !important;
  }
  .whitespace-nowrap {
    white-space: nowrap !important;
  }
  .text-amber-500 {
    color: var(--color-amber-500) !important;
  }
  .text-amber-600 {
    color: var(--color-amber-600) !important;
  }
  .text-amber-700 {
    color: var(--color-amber-700) !important;
  }
  .text-amber-800 {
    color: var(--color-amber-800) !important;
  }
  .text-amber-900 {
    color: var(--color-amber-900) !important;
  }
  .text-amber-950 {
    color: var(--color-amber-950) !important;
  }
  .text-blue-500 {
    color: var(--color-blue-500) !important;
  }
  .text-blue-600 {
    color: var(--color-blue-600) !important;
  }
  .text-blue-700 {
    color: var(--color-blue-700) !important;
  }
  .text-blue-800 {
    color: var(--color-blue-800) !important;
  }
  .text-blue-900 {
    color: var(--color-blue-900) !important;
  }
  .text-blue-950 {
    color: var(--color-blue-950) !important;
  }
  .text-emerald-300 {
    color: var(--color-emerald-300) !important;
  }
  .text-emerald-400 {
    color: var(--color-emerald-400) !important;
  }
  .text-emerald-600 {
    color: var(--color-emerald-600) !important;
  }
  .text-emerald-700 {
    color: var(--color-emerald-700) !important;
  }
  .text-emerald-800 {
    color: var(--color-emerald-800) !important;
  }
  .text-emerald-900 {
    color: var(--color-emerald-900) !important;
  }
  .text-indigo-100 {
    color: var(--color-indigo-100) !important;
  }
  .text-indigo-200 {
    color: var(--color-indigo-200) !important;
  }
  .text-indigo-300 {
    color: var(--color-indigo-300) !important;
  }
  .text-indigo-400 {
    color: var(--color-indigo-400) !important;
  }
  .text-indigo-600 {
    color: var(--color-indigo-600) !important;
  }
  .text-indigo-700 {
    color: var(--color-indigo-700) !important;
  }
  .text-indigo-800 {
    color: var(--color-indigo-800) !important;
  }
  .text-indigo-900 {
    color: var(--color-indigo-900) !important;
  }
  .text-indigo-950 {
    color: var(--color-indigo-950) !important;
  }
  .text-rose-300 {
    color: var(--color-rose-300) !important;
  }
  .text-rose-500 {
    color: var(--color-rose-500) !important;
  }
  .text-rose-600 {
    color: var(--color-rose-600) !important;
  }
  .text-rose-700 {
    color: var(--color-rose-700) !important;
  }
  .text-rose-800 {
    color: var(--color-rose-800) !important;
  }
  .text-rose-900 {
    color: var(--color-rose-900) !important;
  }
  .text-slate-300 {
    color: var(--color-slate-300) !important;
  }
  .text-slate-400 {
    color: var(--color-slate-400) !important;
  }
  .text-slate-500 {
    color: var(--color-slate-500) !important;
  }
  .text-slate-600 {
    color: var(--color-slate-600) !important;
  }
  .text-slate-700 {
    color: var(--color-slate-700) !important;
  }
  .text-slate-800 {
    color: var(--color-slate-800) !important;
  }
  .text-slate-900 {
    color: var(--color-slate-900) !important;
  }
  .text-teal-600 {
    color: var(--color-teal-600) !important;
  }
  .text-white {
    color: var(--color-white) !important;
  }
  .uppercase {
    text-transform: uppercase !important;
  }
  .italic {
    font-style: italic !important;
  }
  .accent-indigo-600 {
    accent-color: var(--color-indigo-600) !important;
  }
  .shadow-inner {
    --tw-shadow: inset 0 2px 4px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-xl {
    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-xs {
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05)) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .shadow-indigo-200 {
    --tw-shadow-color: oklch(87% 0.065 274.039) !important;
    @supports (color: color-mix(in lab, red, red)) {
      --tw-shadow-color: color-mix(in oklab, var(--color-indigo-200) var(--tw-shadow-alpha), transparent) !important;
    }
  }
  .drop-shadow-xs {
    --tw-drop-shadow-size: drop-shadow(0 1px 1px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.05))) !important;
    --tw-drop-shadow: drop-shadow(var(--drop-shadow-xs)) !important;
    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,) !important;
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
  .transition-all {
    transition-property: all !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
  .transition-colors {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to !important;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)) !important;
    transition-duration: var(--tw-duration, var(--default-transition-duration)) !important;
  }
  .duration-300 {
    --tw-duration: 300ms;
    transition-duration: 300ms;
  }
  @media (hover: hover) {
    .hover\:bg-emerald-700:hover {
      background-color: var(--color-emerald-700) !important;
    }
    .hover\:bg-indigo-700:hover {
      background-color: var(--color-indigo-700) !important;
    }
    .hover\:bg-slate-50:hover {
      background-color: var(--color-slate-50) !important;
    }
    .hover\:text-slate-800:hover {
      color: var(--color-slate-800) !important;
    }
    .hover\:text-slate-900:hover {
      color: var(--color-slate-900) !important;
    }
  }
  .focus\:ring-2:focus {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  }
  .focus\:ring-indigo-500:focus {
    --tw-ring-color: var(--color-indigo-500) !important;
  }
  .focus\:outline-none:focus {
    --tw-outline-style: none !important;
    outline-style: none !important;
  }
  @media (width >= 40rem) {
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sm\:grid-cols-5 {
      grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
    .sm\:border-t-0 {
      border-top-style: var(--tw-border-style) !important;
      border-top-width: 0px !important;
    }
    .sm\:border-l {
      border-left-style: var(--tw-border-style) !important;
      border-left-width: 1px !important;
    }
    .sm\:p-12 {
      padding: calc(var(--spacing) * 12) !important;
    }
    .sm\:px-6 {
      padding-inline: calc(var(--spacing) * 6) !important;
    }
    .sm\:pt-0 {
      padding-top: 0px !important;
    }
    .sm\:pl-4 {
      padding-left: calc(var(--spacing) * 4) !important;
    }
    .sm\:text-2xl {
      font-size: var(--text-2xl) !important;
      line-height: var(--tw-leading, var(--text-2xl--line-height)) !important;
    }
    .sm\:text-base {
      font-size: var(--text-base) !important;
      line-height: var(--tw-leading, var(--text-base--line-height)) !important;
    }
    .sm\:text-sm {
      font-size: var(--text-sm) !important;
      line-height: var(--tw-leading, var(--text-sm--line-height)) !important;
    }
  }
  @media (width >= 48rem) {
    .md\:col-span-5 {
      grid-column: span 5 / span 5 !important;
    }
    .md\:col-span-7 {
      grid-column: span 7 / span 7 !important;
    }
    .md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .md\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    .md\:grid-cols-4 {
      grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    .md\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    }
    .md\:flex-row {
      flex-direction: row !important;
    }
    .md\:items-center {
      align-items: center !important;
    }
    .md\:border-t-0 {
      border-top-style: var(--tw-border-style) !important;
      border-top-width: 0px !important;
    }
    .md\:border-l {
      border-left-style: var(--tw-border-style) !important;
      border-left-width: 1px !important;
    }
    .md\:pt-0 {
      padding-top: 0px !important;
    }
    .md\:pl-6 {
      padding-left: calc(var(--spacing) * 6) !important;
    }
  }
  @media (width >= 64rem) {
    .lg\:col-span-4 {
      grid-column: span 4 / span 4 !important;
    }
    .lg\:col-span-5 {
      grid-column: span 5 / span 5 !important;
    }
    .lg\:col-span-7 {
      grid-column: span 7 / span 7 !important;
    }
    .lg\:col-span-8 {
      grid-column: span 8 / span 8 !important;
    }
    .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .lg\:grid-cols-12 {
      grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    }
    .lg\:px-8 {
      padding-inline: calc(var(--spacing) * 8) !important;
    }
  }
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-gradient-position {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}
@property --tw-gradient-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false;
}
@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}
@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@property --tw-duration {
  syntax: "*";
  inherits: false;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *, ::before, ::after, ::backdrop {
      --tw-space-y-reverse: 0;
      --tw-space-x-reverse: 0;
      --tw-divide-y-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-duration: initial;
    }
  }
}

button.tab-btn:hover {
	background: #f5f5f5;
	color: #2b5664 !important;
}
button.tab-btn.tab-active {
	background: #f5f5f5 !important;
	color: #2b5664;
}


/* Plotly CSS */
/* 1. Prevent WordPress/Elementor theme styles from breaking Plotly SVGs */
  .js-plotly-plot .plotly .main-svg {
    position: absolute !important;
    overflow: visible !important;
  }

  /* 2. Fix Tooltip SVG positioning reset */
  .js-plotly-plot .plotly .hoverlayer g.hovertext path {
    transform: none !important;
  }

  .js-plotly-plot .plotly .hovertext {
    box-sizing: content-box !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    text-shadow: none !important;
  }

  /* 3. Fix line height and text alignment issues inside hover box */
  .js-plotly-plot .plotly .hoverlayer text {
    font-family: inherit !important;
    line-height: normal !important;
    dominant-baseline: auto !important;
  }

  /* 4. Ensure wrapper div keeps relative positioning context */
  .js-plotly-plot .plot-container {
    position: relative !important;
    width: 100% !important;
  }

/* 1. CRITICAL: Stop WP theme transitions from animating tooltips from top-left (0,0) */
  .js-plotly-plot,
  .js-plotly-plot *,
  .js-plotly-plot *::before,
  .js-plotly-plot *::after {
    transition: none !important;
    animation: none !important;
  }

  /* 2. Prevent Elementor container transforms from breaking coordinate offsets */
  .elementor-widget-html,
  .elementor-element,
  .elementor-widget-container {
    transform: none !important;
    perspective: none !important;
  }

  /* 3. Force SVG layers to align cleanly */
  .js-plotly-plot .plotly,
  .js-plotly-plot .plotly .main-svg {
    position: ;
    overflow: visible !important;
  }

  .js-plotly-plot .plotly .hoverlayer {
    pointer-events: none !important;
  }

  /* 4. Fix text alignment and prevent text line wrap garbling inside hover box */
  .js-plotly-plot .plotly .hoverlayer text {
    font-family: inherit !important;
    white-space: pre !important;
    dominant-baseline: auto !important;
  }

/* Active tab style */
    .single-case_body .tab-active {
      border-color: #4f46e5;
      color: #4f46e5;
      background-color: #f8fafc;
      border-bottom-width: 3px;
    }

    /* Print styling */
    @media print {
      .single-case_body .no-print {
        display: none !important;
      }
      .single-case_body .print-full {
        width: 100% !important;
        box-shadow: none !important;
        margin: 0 !important;
        padding: 0 !important;
      }
    }

#statistics-panel table td, #statistics-panel table th {
	border: none !important;
}