/*!
Theme Name: alami
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: alami
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

alami is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/


form br{
    display: none;
}

form p {
    margin: 0;
}

form .form-group p{
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}


/* ===================================================================
   Styles for the single-post template — targets the EXACT classes/IDs
   WordPress already outputs. No HTML changes required.
   Assumes the theme's main stylesheet (with the :root variables,
   fonts, .btn-primary, --card, --border, etc.) is already enqueued.
   =================================================================== */

/* ---------- Page wrapper ---------- */
#primary.site-main {
  max-width: 860px;
  margin: 0 auto;
  padding: 3.5rem 1.5rem 5rem;
}

/* ---------- Article card ---------- */
article.post {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 2.5rem;
  box-shadow: var(--shadow-card);
}
@media (max-width: 640px) {
  article.post { padding: 1.5rem; border-radius: 0.75rem; }
}

/* ---------- Header / title / meta ---------- */
.entry-header { margin-bottom: 2rem; background: none;}

.entry-title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--foreground);
  margin-bottom: 1rem;
}

.entry-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.entry-meta .posted-on::after {
  content: '';
  display: inline-block;
  width: 3px; height: 3px; border-radius: 50%;
  background: currentColor; opacity: 0.5;
  margin-left: 0.75rem;
}

.entry-meta a { color: var(--muted-foreground); transition: color 0.2s; }
.entry-meta a:hover { color: var(--brand-blue); }

.entry-meta time.updated { display: none; } /* WP prints both published + updated; hide the duplicate */

.byline .author.vcard a {
  color: var(--brand-blue);
  font-weight: 500;
}
.byline .author.vcard a:hover { color: var(--brand-cyan); }

/* ---------- Body content ---------- */
.entry-content {
  color: var(--foreground);
  font-size: 1.0625rem;
  line-height: 1.75;
}
.entry-content > * + * { margin-top: 1.25rem; }

.entry-content h2 {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 2.5rem;
  color: var(--foreground);
}
.entry-content h3 {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 600;
  margin-top: 1.75rem;
}
.entry-content p { color: oklch(1 0 0 / 0.82); }
.entry-content a {
  color: var(--brand-blue);
  border-bottom: 1px solid oklch(0.70 0.16 162 / 0.4);
  transition: color 0.2s, border-color 0.2s;
}
.entry-content a:hover { color: var(--brand-cyan); border-color: var(--brand-cyan); }

.entry-content ul, .entry-content ol {
  padding-left: 1.25rem;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { color: oklch(1 0 0 / 0.82); }

.entry-content blockquote {
  padding: 1.5rem 1.75rem;
  border-left: 3px solid var(--brand-blue);
  background: oklch(1 0 0 / 0.03);
  border-radius: 0.5rem;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.125rem;
  color: var(--foreground);
}

.entry-content img {
  border-radius: 0.75rem;
  margin: 0.5rem 0;
}

/* Empty-state hint (only shows if entry-content has literally nothing in it) */
.entry-content:empty::before {
  content: 'No content yet.';
  display: block;
  color: var(--muted-foreground);
  font-style: italic;
  padding: 1rem 0;
}

/* ---------- Footer meta (categories, edit link) ---------- */
.entry-footer {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.8125rem;
	background: none;
}

.cat-links a {
  display: inline-block;
  padding: 0.3rem 0.75rem;
  border-radius: 9999px;
  background: oklch(0.70 0.16 162 / 0.12);
  color: var(--brand-blue);
  font-weight: 500;
  transition: background 0.2s, color 0.2s;
}
.cat-links a:hover { background: var(--brand-blue); color: #fff; }

.edit-link a {
  color: var(--muted-foreground);
  text-decoration: underline;
}
.edit-link a:hover { color: var(--brand-cyan); }

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* ---------- Post navigation (prev/next) ---------- */
.post-navigation {
  margin-top: 2.5rem;
}
.post-navigation .nav-links {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.post-navigation .nav-previous,
.post-navigation .nav-next { display: flex; }
.post-navigation .nav-next { grid-column: 2; text-align: right; }
.post-navigation:has(.nav-previous):not(:has(.nav-next)) .nav-previous { grid-column: 1 / -1; }

.post-navigation a {
  display: block;
  width: 100%;
  padding: 1.25rem 1.5rem;
  border-radius: 0.75rem;
  background: oklch(1 0 0 / 0.03);
  border: 1px solid var(--border);
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.2s;
}
.post-navigation a:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
  border-color: var(--brand-blue);
}
.post-navigation .nav-subtitle {
  display: block;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--muted-foreground);
  margin-bottom: 0.35rem;
}
.post-navigation .nav-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--foreground);
  line-height: 1.35;
}

@media (max-width: 640px) {
  .post-navigation .nav-links { grid-template-columns: 1fr; }
  .post-navigation .nav-next { grid-column: 1; text-align: left; }
}

/* ---------- Comments ---------- */
.comments-area {
  max-width: 860px;
  margin: 2.5rem auto 0;
  padding: 0;
}

.comment-respond {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 1rem;
  padding: 2rem 2.25rem;
  box-shadow: var(--shadow-card);
}
@media (max-width: 640px) {
  .comment-respond { padding: 1.5rem; }
}

#reply-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.375rem;
  color: var(--foreground);
  margin-bottom: 0.5rem;
}
#reply-title small a {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--brand-blue);
}

.logged-in-as {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  margin-bottom: 1.5rem;
}
.logged-in-as a { color: var(--brand-blue); }
.logged-in-as a:hover { color: var(--brand-cyan); }
.required-field-message { display: block; margin-top: 0.25rem; }
.required { color: var(--brand-cyan); }

.comment-form-comment { margin-bottom: 1.25rem; }
.comment-form-comment label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
  color: var(--foreground);
}

#comment {
  width: 100%;
  padding: 0.75rem 0.9rem;
  min-height: 8rem;
  resize: vertical;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: oklch(0.27 0.035 175 / 0.5);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-size: 0.9rem;
  outline: none;
  transition: border-color 0.2s;
}
#comment:focus { border-color: var(--brand-blue); }

.form-submit { margin-top: 0.5rem; }

.form-submit

#submit.submit {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  border-radius: var(--radius);
  border: none;
  background: none;
  color: #fff;
  font-weight: 500;
  font-size: 0.9rem;
  box-shadow: var(--shadow-glow);
  transition: opacity 0.2s;
}
#submit.submit:hover { opacity: 0.9; }

/* =====================================================================
   Стили для секции #project-directions (title.php)
   Извлечено из присланного Tailwind-CSS — оставлены только классы,
   которые реально используются в разметке этой секции.
   Добавьте этот блок в style.css темы (или подключите отдельным файлом).
   ===================================================================== */

/* ---- layout / position ---- */
.relative      { position: relative; }
.absolute      { position: absolute; }
.inset-0       { inset: 0; }
.right-0       { right: 0; }
.-top-10       { top: -2.5rem; }
.-left-32      { left: -8rem; }
.top-1\/3      { top: 33.3333%; }

/* ---- размеры (произвольные значения из макета) ---- */
.w-\[460px\]   { width: 460px; }
.h-\[460px\]   { height: 460px; }
.w-\[280px\]   { width: 280px; }
.w-8           { width: 2rem; }
.h-px          { height: 1px; }

/* ---- контейнер / сетка ---- */
.container     { width: 100%; }
@media (min-width: 40rem) { .container { max-width: 40rem; } }
@media (min-width: 48rem) { .container { max-width: 48rem; } }
@media (min-width: 64rem) { .container { max-width: 64rem; } }
@media (min-width: 80rem) { .container { max-width: 80rem; } }
@media (min-width: 96rem) { .container { max-width: 96rem; } }

.mx-auto       { margin-inline: auto; }
.px-6          { padding-inline: 1.5rem; }
.max-w-3xl     { max-width: 48rem; }

.grid          { display: grid; }
.flex          { display: flex; }
.inline-flex   { display: inline-flex; }
.flex-wrap     { flex-wrap: wrap; }
.items-center  { align-items: center; }

.gap-2         { gap: 0.5rem; }
.gap-6         { gap: 1.5rem; }

.grid-cols-1   { grid-template-columns: repeat(1, minmax(0, 1fr)); }
@media (min-width: 48rem) {
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- отступы ---- */
.py-20         { padding-block: 5rem; }
@media (min-width: 48rem) {
    .md\:py-28 { padding-block: 7rem; }
    .md\:mb-8  { margin-bottom: 2rem; }
    .md\:text-5xl { font-size: 3rem; line-height: 1; }
}
.mb-3          { margin-bottom: 0.75rem; }
.mb-4          { margin-bottom: 1rem; }
.mb-6          { margin-bottom: 1.5rem; }
.p-8           { padding: 2rem; }
.px-3          { padding-inline: 0.75rem; }
.py-1          { padding-block: 0.25rem; }
.pt-4          { padding-top: 1rem; }

/* ---- декоративные элементы (пятна, сетки) ---- */
.overflow-hidden     { overflow: hidden; }
.pointer-events-none { pointer-events: none; }
.select-none         { -webkit-user-select: none; user-select: none; }
.rotate-12           { rotate: 12deg; }
.opacity-70          { opacity: .7; }
.opacity-\[0\.12\]   { opacity: .12; }

.bg-dots {
    background-image: radial-gradient(#019f6824 1px, transparent 1px);
    background-size: 22px 22px;
}
.mask-fade {
    -webkit-mask-image: radial-gradient(#000 40%, transparent 80%);
    mask-image: radial-gradient(#000 40%, transparent 80%);
}
.blob {
    position: absolute;
    z-index: 0;
    border-radius: 9999px;
    filter: blur(80px);
    opacity: .55;
    pointer-events: none;
}
.blob-cyan {
    background: radial-gradient(circle, #3ed0c873, transparent 70%);
}

/* ---- reveal / hover (анимации появления и наведения — см. базовую тему) ---- */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .9s var(--transition-smooth, cubic-bezier(.22,1,.36,1)),
                transform .9s var(--transition-smooth, cubic-bezier(.22,1,.36,1));
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

.hover-lift {
    transition: transform .45s var(--transition-smooth, cubic-bezier(.22,1,.36,1)),
                box-shadow .45s var(--transition-smooth, cubic-bezier(.22,1,.36,1));
}
.hover-lift:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-elegant, 0 24px 70px -20px rgba(0,5,3,.75));
}

/* ---- типографика ---- */
.text-xs       { font-size: .75rem; line-height: calc(1/.75); }
.text-sm       { font-size: .875rem; line-height: calc(1.25/.875); }
.text-lg       { font-size: 1.125rem; line-height: calc(1.75/1.125); }
.text-2xl      { font-size: 1.5rem; line-height: calc(2/1.5); }
.text-3xl      { font-size: 1.875rem; line-height: 1.2; }

.font-display  { font-family: "Manrope", system-ui, sans-serif; }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }

.leading-tight    { line-height: 1.25; }
.leading-relaxed  { line-height: 1.625; }

.tracking-\[0\.18em\] { letter-spacing: .18em; }
.uppercase     { text-transform: uppercase; }

/* ---- рамки / фон / скругления ---- */
.rounded-2xl   { border-radius: calc(var(--radius, .625rem) + 8px); }
.rounded-full  { border-radius: 9999px; }

.border        { border: 1px solid; }
.border-t      { border-top: 1px solid; }
.border-border { border-color: var(--border); }

.bg-card       { background-color: var(--card); }
.bg-muted      { background-color: var(--muted); }

/* Брендовые акцентные цвета/фоны (с прозрачностью) */
.text-\[var\(--brand-blue\)\] { color: var(--brand-blue); }
.text-\[var\(--brand-cyan\)\] { color: var(--brand-cyan); }
.bg-\[var\(--brand-blue\)\]   { background-color: var(--brand-blue); }

.bg-\[var\(--brand-blue\)\]\/10 {
    background-color: var(--brand-blue);
}
@supports (color: color-mix(in lab, red, red)) {
    .bg-\[var\(--brand-blue\)\]\/10 {
        background-color: color-mix(in oklab, var(--brand-blue) 10%, transparent);
    }
}

.bg-\[var\(--brand-cyan\)\]\/10 {
    background-color: var(--brand-cyan);
}
@supports (color: color-mix(in lab, red, red)) {
    .bg-\[var\(--brand-cyan\)\]\/10 {
        background-color: color-mix(in oklab, var(--brand-cyan) 10%, transparent);
    }
}

.text-foreground        { color: var(--foreground); }
.text-muted-foreground  { color: var(--muted-foreground); }


/* =====================================================================
   Стили для <section id="project-directions"> и всего его содержимого
   Извлечено дословно из присланного компилированного CSS.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Сам тег <section>
   class="relative py-20 md:py-28 overflow-hidden"
   style="background:var(--gradient-subtle)"
   --------------------------------------------------------------------- */
.relative { position: relative; }
.overflow-hidden { overflow: hidden; }
.py-20 { padding-block: calc(var(--spacing) * 20); }
@media (min-width: 48rem) {
    .md\:py-28 { padding-block: calc(var(--spacing) * 28); }
}

/* ---------------------------------------------------------------------
   2. Декоративные слои внутри секции (точки, пятно, лист)
   --------------------------------------------------------------------- */
.absolute { position: absolute; }
.inset-0 { inset: calc(var(--spacing) * 0); }
.pointer-events-none { pointer-events: none; }
.opacity-70 { opacity: .7; }
.opacity-\[0\.12\] { opacity: .12; }
.select-none { -webkit-user-select: none; user-select: none; }
.rotate-12 { rotate: 12deg; }
.right-0 { right: calc(var(--spacing) * 0); }
.-top-10 { top: calc(var(--spacing) * -10); }
.-left-32 { left: calc(var(--spacing) * -32); }
.top-1\/3 { top: 33.3333%; }

.w-\[460px\] { width: 460px; }
.h-\[460px\] { height: 460px; }
.w-\[280px\] { width: 280px; }

.bg-dots {
    background-image: radial-gradient(#019f6824 1px, #0000 1px);
    background-size: 22px 22px;
}
.mask-fade {
    -webkit-mask-image: radial-gradient(#000 40%, #0000 80%);
    mask-image: radial-gradient(#000 40%, #0000 80%);
}
.blob {
    filter: blur(80px);
    opacity: .55;
    pointer-events: none;
    z-index: 0;
    border-radius: 9999px;
    position: absolute;
}
.blob-cyan {
    background: radial-gradient(circle, #3ed0c873, #0000 70%);
}

/* ---------------------------------------------------------------------
   3. Контейнер и заголовок секции
   --------------------------------------------------------------------- */
.container { width: 100%; }
@media (min-width: 40rem) { .container { max-width: 40rem; } }
@media (min-width: 48rem) { .container { max-width: 48rem; } }
@media (min-width: 64rem) { .container { max-width: 64rem; } }
@media (min-width: 80rem) { .container { max-width: 80rem; } }
@media (min-width: 96rem) { .container { max-width: 96rem; } }

.mx-auto { margin-inline: auto; }
.px-6 { padding-inline: calc(var(--spacing) * 6); }
.max-w-3xl { max-width: var(--container-3xl); }
.mb-6 { margin-bottom: calc(var(--spacing) * 6); }
@media (min-width: 48rem) {
    .md\:mb-8 { margin-bottom: calc(var(--spacing) * 8); }
}

.inline-flex { display: inline-flex; }
.items-center { align-items: center; }
.gap-2 { gap: calc(var(--spacing) * 2); }
.text-xs { font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); }
.font-medium { font-weight: var(--font-weight-medium); }
.tracking-\[0\.18em\] { letter-spacing: .18em; }
.uppercase { text-transform: uppercase; }
.mb-3 { margin-bottom: calc(var(--spacing) * 3); }

.w-8 { width: calc(var(--spacing) * 8); }
.h-px { height: 1px; }

.text-3xl { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); }
@media (min-width: 48rem) {
    .md\:text-5xl { font-size: var(--text-5xl); line-height: var(--tw-leading, var(--text-5xl--line-height)); }
}
.font-bold { font-weight: var(--font-weight-bold); }
.leading-tight { line-height: var(--leading-tight); }

.text-lg { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); }
.leading-relaxed { line-height: var(--leading-relaxed); }
.text-muted-foreground { color: var(--muted-foreground); }

/* ---------------------------------------------------------------------
   4. Сетка карточек
   --------------------------------------------------------------------- */
.grid { display: grid; }
.gap-6 { gap: calc(var(--spacing) * 6); }
@media (min-width: 48rem) {
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------------
   5. Карточка проекта
   --------------------------------------------------------------------- */
.p-8 { padding: calc(var(--spacing) * 8); }
.rounded-2xl { border-radius: calc(var(--radius) + 8px); }
.bg-card { background-color: var(--card); }
.border { border-style: var(--tw-border-style); border-width: 1px; }
.border-border { border-color: var(--border); }

.reveal {
    opacity: 0;
    transition: opacity .9s var(--transition-smooth), transform .9s var(--transition-smooth);
    transform: translateY(28px);
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

.hover-lift {
    transition: transform .45s var(--transition-smooth), box-shadow .45s var(--transition-smooth);
}
.hover-lift:hover {
    box-shadow: var(--shadow-elegant);
    transform: translateY(-6px);
}

/* ---- строка с тремя тегами (сектор / регион / статус) ---- */
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.mb-4 { margin-bottom: calc(var(--spacing) * 4); }

.px-3 { padding-inline: calc(var(--spacing) * 3); }
.py-1 { padding-block: calc(var(--spacing) * 1); }
.rounded-full { border-radius: 3.40282e38px; }

.bg-\[var\(--brand-blue\)\]\/10 {
    background-color: var(--brand-blue);
}
@supports (color: color-mix(in lab, red, red)) {
    .bg-\[var\(--brand-blue\)\]\/10 {
        background-color: color-mix(in oklab, var(--brand-blue) 10%, transparent);
    }
}
.text-\[var\(--brand-blue\)\] { color: var(--brand-blue); }

.bg-muted { background-color: var(--muted); }

.bg-\[var\(--brand-cyan\)\]\/10 {
    background-color: var(--brand-cyan);
}
@supports (color: color-mix(in lab, red, red)) {
    .bg-\[var\(--brand-cyan\)\]\/10 {
        background-color: color-mix(in oklab, var(--brand-cyan) 10%, transparent);
    }
}
.text-\[var\(--brand-cyan\)\] { color: var(--brand-cyan); }

/* ---- заголовок и описание карточки ---- */
.font-display { font-family: Manrope, system-ui, sans-serif; }
.font-semibold { font-weight: var(--font-weight-semibold); }
.text-2xl { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); }

/* ---- строка "ALAMI Role" ---- */
.text-sm { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); }
.border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; }
.pt-4 { padding-top: calc(var(--spacing) * 4); }
.text-foreground { color: var(--foreground); }

/* =====================================================================
   6. CSS-переменные (взяты дословно из :root присланного файла).
   Если они уже объявлены в основном style.css темы — не дублируйте.
   ===================================================================== */
:root {
    --spacing: .25rem;
    --radius: .625rem;
    --background: #122c25;
    --foreground: #fff;
    --card: #1a3a32;
    --card-foreground: #fff;
    --muted: #142f28;
    --muted-foreground: #a4a4a8;
    --border: #2a3c37;
    --brand-blue: #00bb80;
    --brand-cyan: #51d39c;
    --gradient-subtle: linear-gradient(180deg, #122c25 0%, #1a3a32 100%);
    --shadow-elegant: 0 24px 70px -20px #000503bf;
    --transition-smooth: cubic-bezier(.22, 1, .36, 1);

    --text-xs: .75rem;            --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;           --text-sm--line-height: calc(1.25 / .875);
    --text-lg: 1.125rem;          --text-lg--line-height: calc(1.75 / 1.125);
    --text-2xl: 1.5rem;           --text-2xl--line-height: calc(2 / 1.5);
    --text-3xl: 1.875rem;         --text-3xl--line-height: 1.2;
    --text-5xl: 3rem;             --text-5xl--line-height: 1;

    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --leading-tight: 1.25;
    --leading-relaxed: 1.625;

    --container-3xl: 48rem;
    --tw-border-style: solid;
}

/* Поддержка LAB-цветов (более точная передача оттенков в современных браузерах) */
@supports (color: lab(0% 0 0)) {
    :root {
        --background: lab(15.773% -12.1505 1.05988);
        --foreground: lab(100% 0 0);
        --card: lab(21.6378% -13.8709 1.21077);
        --muted: lab(16.9331% -12.137 1.05943);
        --muted-foreground: lab(67.4767% .493079 -1.81921);
        --border: lab(23.7639% -8.56754 .753123);
        --brand-blue: lab(67.3105% -54.4244 18.8686);
        --brand-cyan: lab(76.3379% -47.0074 16.3883);
        --gradient-subtle: linear-gradient(180deg, lab(15.773% -12.1505 1.05988) 0%, lab(21.6378% -13.8709 1.21077) 100%);
        --shadow-elegant: 0 24px 70px -20px lab(.965052% -1.4984 .144437/.75);
    }
}