/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[2].use[1]!./node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[2].use[2]!./node_modules/next/font/google/target.css?{"path":"src/app/layout.tsx","import":"Bricolage_Grotesque","arguments":[{"variable":"--font-bricolage","subsets":["latin"],"weight":["200","300","400","500","600","700","800"],"display":"swap"}],"variableName":"bricolage"} ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 200;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 300;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/93a6e477e1480c92-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/c7e0cf6c760983e7-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 800;
  font-stretch: 100%;
  font-display: swap;
  src: url(/_next/static/media/9d5a263311222317-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: 'Bricolage Grotesque Fallback';src: local("Arial");ascent-override: 88.21%;descent-override: 25.61%;line-gap-override: 0.00%;size-adjust: 105.43%
}.__className_416171 {font-family: 'Bricolage Grotesque', 'Bricolage Grotesque Fallback';font-style: normal
}.__variable_416171 {--font-bricolage: 'Bricolage Grotesque', 'Bricolage Grotesque Fallback'
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[2].use[1]!./node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[2].use[2]!./node_modules/next/font/google/target.css?{"path":"src/app/layout.tsx","import":"DM_Sans","arguments":[{"variable":"--font-dm-sans","subsets":["latin"],"weight":["300","400","500","700"],"display":"swap"}],"variableName":"dmSans"} ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_next/static/media/7ab938503e4547a1-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_next/static/media/13971731025ec697-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: 'DM Sans Fallback';src: local("Arial");ascent-override: 94.90%;descent-override: 29.66%;line-gap-override: 0.00%;size-adjust: 104.53%
}.__className_97ada1 {font-family: 'DM Sans', 'DM Sans Fallback';font-style: normal
}.__variable_97ada1 {--font-dm-sans: 'DM Sans', 'DM Sans Fallback'
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[11].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[11].use[5]!./src/app/global.scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* ───────────── LIGHT (default) ───────────── */
:root {
  /* typography */
  --font-primary: "Bricolage Grotesque", "DM Sans", system-ui, sans-serif;
  --font-display: "Bricolage Grotesque", "DM Sans", system-ui, sans-serif;
  --font-body: "DM Sans", -apple-system, system-ui, sans-serif;
  --font-mono: ui-monospace, "JetBrains Mono", "SFMono-Regular", Menlo, monospace;
  /* page + surfaces */
  --bg-page: #f6f4ee;
  --bg-color: #f6f4ee;
  --color-bg: #f6f4ee;
  --section-bg: #f6f4ee;
  --bg-surface: #ffffff;
  --bg-surface-2: #eeece4;
  --border-color: #dedbd0;
  /* text */
  --text-primary: #16190f;
  --text-color: #16190f;
  --heading-color: #16190f;
  --text-secondary: #5a5e50;
  /* brand */
  --primary-color: #1d3544;
  --secondary-color: #273416;
  --accent-color: #d1f48c;
  --accent-soft: #eef9d6;
  --dot-core: #243114; /* centre of the lime checklist dots */
  /* semantic aliases */
  --color-ink: #16190f;
  --color-muted: #63675a;
  --color-bg-muted: #f4f0e6;
  --color-bg-alt: #f8f5ee;
  --color-blue-light: #eaf1ff;
  --color-ink-soft: #1c2117;
  --color-border: #dedbd0;
  --color-primary: #d1f48c;
  --color-accent: #273416;
  --card-bg: #ffffff;
  --card-border: #dedbd0;
  --card-bg-alt: #eeece4; /* "Ours" panel */
  /* forms */
  --input-bg: #ffffff;
  --input-border: #d0d0d0;
  --input-text: #16190f;
  --placeholder-color: #83877a;
  /* sidebar + layout */
  --sidebar-bg: #ffffff;
  --sidebar-border: #dedbd0;
  --sidebar-item-hover: #f7f7f7;
  --sidebar-item-active: #f1efe9;
  --track-bg: #e6e3dc;
  /* primary CTA: deep green, cream text */
  --cta-bg: #1f3a27;
  --cta-bg-hover: #2a4c34;
  --cta-text: #f4f7ec;
  --focus-ring: #1f3a27;
  /* pricing + plan cards */
  --check-color: #1f3a27; /* ✓ marks */
  --featured-border: #1a1a17; /* Per program / Every program border */
  --tag-bg: #1a1a17; /* "Start with one" pill */
  --tag-text: #ffffff;
  --chip-icon-bg: #e8e6dd; /* × circle */
  --personalize-border: #d9d4c4;
  /* "Margin-free · 0% markup" badge */
  --badge-bg: #1a1a17;
  --badge-accent: #d1f48c;
  --badge-text: #ffffff;
  /* old nav / footer (unchanged) */
  --nav-bg: #1d3544;
  --nav-text: rgba(255, 255, 255, 0.75);
  --nav-text-active: #ffffff;
  --nav-dropdown-bg: #ffffff;
  --nav-dropdown-border: rgba(227, 227, 227, 0.7);
  --nav-dropdown-item-hover: #f5f5f5;
  --footer-bg: #232323;
  --footer-text: #ffffff;
  /* links + status */
  --link-color: #1f3a27;
  --ok-color: #276b43;
  --ok-soft: #e3f2e8;
  --warn-color: #8a5a0e;
  --warn-soft: #fbf0da;
  --bad-color: #c2412d;
  --bad-soft: #fbe7e2;
  /* shadows */
  --shadow-card: 0 1px 2px rgba(22, 25, 15, 0.06), 0 10px 30px -14px rgba(22, 25, 15, 0.22);
  --shadow-dropdown: 0 24px 48px -24px rgba(15, 35, 45, 0.28);
}

/* ───────────── DARK ───────────── */
[data-theme=dark] {
  /* page + surfaces */
  --bg-page: #11130d;
  --bg-color: #11130d;
  --color-bg: #11130d;
  --section-bg: #11130d;
  --bg-surface: #191c14;
  --bg-surface-2: #20241a;
  --border-color: #2e3326;
  /* text */
  --text-primary: #eeefe6;
  --text-color: #eeefe6;
  --heading-color: #eeefe6;
  --text-secondary: #a9ad9c;
  /* brand */
  --primary-color: #111d26;
  --secondary-color: #d1f48c;
  --accent-color: #d1f48c;
  --accent-soft: #26301a;
  --dot-core: #11130d;
  /* semantic aliases */
  --color-ink: #eeefe6;
  --color-muted: #8f9484;
  --color-bg-muted: #191c14;
  --color-bg-alt: #151a12;
  --color-blue-light: #0f1e32;
  --color-ink-soft: #d1f48c;
  --color-border: #2e3326;
  --color-primary: #d1f48c;
  --color-accent: #d1f48c;
  --card-bg: #191c14;
  --card-border: #2e3326;
  --card-bg-alt: #20241a;
  /* forms */
  --input-bg: #1e2420;
  --input-border: #3a4038;
  --input-text: #eeefe6;
  --placeholder-color: #7a7f70;
  /* sidebar + layout */
  --sidebar-bg: #141915;
  --sidebar-border: #2e3326;
  --sidebar-item-hover: #1b211c;
  --sidebar-item-active: #202720;
  --track-bg: #232a24;
  /* primary CTA: lime, dark text */
  --cta-bg: #d1f48c;
  --cta-bg-hover: #c2ec72;
  --cta-text: #1a2410;
  --focus-ring: #d1f48c;
  /* pricing + plan cards */
  --check-color: #5fcf8a;
  --featured-border: #f1f1ea;
  --tag-bg: #eeeee6;
  --tag-text: #121510;
  --chip-icon-bg: #2a2f27;
  --personalize-border: #3d4a22;
  /* "Margin-free · 0% markup" badge */
  --badge-bg: #232d12;
  --badge-accent: #d1f48c;
  --badge-text: #e8ebe3;
  /* old nav / footer (unchanged) */
  --nav-bg: #111d26;
  --nav-text: rgba(255, 255, 255, 0.7);
  --nav-text-active: #ffffff;
  --nav-dropdown-bg: #1a2018;
  --nav-dropdown-border: rgba(60, 70, 55, 0.8);
  --nav-dropdown-item-hover: #242b21;
  --footer-bg: #0d1210;
  --footer-text: rgba(255, 255, 255, 0.85);
  /* links + status */
  --link-color: #d1f48c;
  --ok-color: #6bcb8e;
  --ok-soft: #1d2f22;
  --warn-color: #e6b45c;
  --warn-soft: #33291a;
  --bad-color: #f08a76;
  --bad-soft: #3a201b;
  /* shadows */
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 30px -14px rgba(0, 0, 0, 0.6);
  --shadow-dropdown: 0 24px 48px -24px rgba(0, 0, 0, 0.6);
}

/* ───────────── HIGH CONTRAST ─────────────
   If you already have other html.hc rules elsewhere, keep them;
   these declarations only add the new layout and pricing tokens. */
html.hc {
  --sidebar-bg: #ffffff;
  --sidebar-border: #000000;
  --sidebar-item-hover: #f0f0f0;
  --sidebar-item-active: #e0e0e0;
  --track-bg: #d0d0d0;
  --cta-bg: #000000;
  --cta-bg-hover: #1a1a1a;
  --cta-text: #ffffff;
  --focus-ring: #000000;
  --check-color: #000000;
  --featured-border: #000000;
  --tag-bg: #000000;
  --tag-text: #ffffff;
  --card-border: #000000;
  --input-border: #000000;
  --badge-bg: #000000;
  --badge-accent: #ffffff;
  --badge-text: #ffffff;
}

/* visible keyboard focus everywhere */
:where(a, button, input, [tabindex]):focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* desktop only */
/* small desktop only */
/* Tablet and below */
/* Tablet only */
/* Mobile and smaller screen */
/* smaller screen  */
/* ─── AETHER EMAIL EDITOR THEME ───────────────────── */
:root,
[data-editor-theme=dark] {
  /* Theme colors: connected to the main SCSS variables */
  --primary-color: var(--cta-bg, #1f3a27);
  --secondary-color: var(--secondary-color, #273416);
  --primary-color-light: var(--accent-soft, #e9f7c9);
  /* Studio Backgrounds */
  --studio-bg: #090b10;
  --studio-surface: #10141d;
  --studio-surface-elevated: #161c28;
  --studio-surface-hover: #1c2435;
  --studio-surface-active: #222c40;
  /* Borders */
  --studio-card-border: rgba(255, 255, 255, 0.08);
  --studio-card-border-glow: color-mix(in srgb, var(--primary-color) 25%, transparent);
  --studio-border: rgba(255, 255, 255, 0.09);
  --studio-border-strong: rgba(255, 255, 255, 0.16);
  /* Text */
  --text-main: #f0f4fc;
  --text-muted: #8b9bb4;
  --text-dim: #54647c;
  --text-inverse: #090b10;
  /* Canvas */
  --canvas-area-bg: #0c0f17;
  --canvas-grid-line: rgba(255, 255, 255, 0.03);
  /* Primary Neon Accents */
  --neon-cyan: var(--primary-color);
  --neon-cyan-glow: color-mix(in srgb, var(--primary-color) 35%, transparent);
  --neon-lime: var(--primary-color);
  --neon-lime-glow: color-mix(in srgb, var(--primary-color) 30%, transparent);
  /* Supporting Accents */
  --neon-purple: #9d4edd;
  --neon-amber: #ffb703;
  --neon-rose: #ff4d6d;
  /* Toolbar */
  --toolbar-bg: rgba(14, 18, 26, 0.97);
  --toolbar-border: var(--studio-border);
  /* Sidebar */
  --sidebar-bg: var(--studio-surface);
  /* Inspector */
  --inspector-bg: var(--studio-surface);
  --inspector-header: rgba(10, 13, 19, 0.97);
  /* Inputs */
  --input-bg: #07090e;
  --input-border: rgba(255, 255, 255, 0.1);
  --input-text: #ffffff;
  /* Shadows */
  --shadow-subtle: 0 4px 20px rgba(0, 0, 0, 0.35);
  --shadow-glow: 0 0 25px color-mix(in srgb, var(--primary-color) 15%, transparent);
  --shadow-dropdown: 0 16px 36px rgba(0, 0, 0, 0.65),
    0 0 0 1px rgba(255, 255, 255, 0.1);
  --shadow-canvas: 0 20px 60px rgba(0, 0, 0, 0.65),
    0 0 0 1px rgba(255, 255, 255, 0.08);
  /* Widget Cards */
  --widget-card-bg: var(--studio-surface-elevated);
  --widget-icon-bg: color-mix(in srgb, var(--primary-color) 8%, transparent);
  --widget-icon-fg: var(--primary-color);
  /* Tabs */
  --tab-strip-bg: rgba(10, 13, 19, 0.97);
  /* Selection */
  --selection-ring: var(--primary-color);
  --selection-glow: color-mix(in srgb, var(--primary-color) 25%, transparent);
  /* Empty State */
  --empty-icon-bg: color-mix(in srgb, var(--primary-color) 8%, transparent);
  --empty-title: var(--text-main);
  --empty-desc: #64748b;
  --empty-btn-bg: #0f172a;
  --empty-btn-fg: #ffffff;
  --empty-btn-hover-bg: var(--primary-color);
  --empty-btn-hover-fg: var(--secondary-color);
  /* Section Controls */
  --sec-toolbar-bg: #0f172a;
  --el-action-bg: #090d16;
  --col-empty-border: #cbd5e1;
  /* Modal */
  --modal-overlay: rgba(4, 6, 10, 0.88);
  --modal-bg: var(--studio-surface);
  --modal-header-bg: var(--studio-bg);
  --modal-code-bg: #07090e;
  --modal-code-text: #a5b4fc;
  /* Scrollbar */
  --scrollbar-thumb: rgba(255, 255, 255, 0.12);
  --scrollbar-hover: color-mix(in srgb, var(--primary-color) 40%, transparent);
  /* Toast */
  --toast-bg: var(--studio-surface-elevated);
  --toast-border: var(--studio-border-strong);
  /* Layout */
  --header-height: 56px;
  --sidebar-width: 320px;
  --properties-width: 340px;
}

/* ─── LIGHT THEME ─────────────────────────────────── */
[data-editor-theme=light] {
  /* Theme colors */
  --primary-color: var(--cta-bg, #1f3a27);
  --secondary-color: var(--secondary-color, #273416);
  --primary-color-light: var(--accent-soft, #e9f7c9);
  /* Studio Backgrounds */
  --studio-bg: #f0f2f7;
  --studio-surface: #ffffff;
  --studio-surface-elevated: #f7f8fc;
  --studio-surface-hover: #eef0f7;
  --studio-surface-active: #e4e7f2;
  /* Borders */
  --studio-card-border: rgba(0, 0, 0, 0.08);
  --studio-card-border-glow: color-mix(in srgb, var(--primary-color) 55%, transparent);
  --studio-border: rgba(0, 0, 0, 0.09);
  --studio-border-strong: rgba(0, 0, 0, 0.18);
  /* Text */
  --text-main: #0f172a;
  --text-muted: #475569;
  --text-dim: #94a3b8;
  --text-inverse: #ffffff;
  /* Canvas */
  --canvas-area-bg: #dde1ec;
  --canvas-grid-line: rgba(0, 0, 0, 0.04);
  /* Primary Neon Accents */
  --neon-cyan: var(--primary-color);
  --neon-cyan-glow: color-mix(in srgb, var(--primary-color) 35%, transparent);
  --neon-lime: var(--primary-color);
  --neon-lime-glow: color-mix(in srgb, var(--primary-color) 30%, transparent);
  /* Supporting Accents */
  --neon-purple: #7c3aed;
  --neon-amber: #b45309;
  --neon-rose: #e11d48;
  /* Toolbar */
  --toolbar-bg: rgba(255, 255, 255, 0.97);
  --toolbar-border: var(--studio-border);
  /* Sidebar */
  --sidebar-bg: var(--studio-surface);
  /* Inspector */
  --inspector-bg: var(--studio-surface);
  --inspector-header: rgba(248, 250, 252, 0.97);
  /* Inputs */
  --input-bg: #f1f5f9;
  --input-border: rgba(0, 0, 0, 0.12);
  --input-text: #0f172a;
  /* Shadows */
  --shadow-subtle: 0 2px 12px rgba(0, 0, 0, 0.08);
  --shadow-glow: 0 0 18px color-mix(in srgb, var(--primary-color) 18%, transparent);
  --shadow-dropdown: 0 12px 32px rgba(0, 0, 0, 0.15),
    0 0 0 1px rgba(0, 0, 0, 0.08);
  --shadow-canvas: 0 12px 40px rgba(0, 0, 0, 0.14),
    0 0 0 1px rgba(0, 0, 0, 0.08);
  /* Widget Cards */
  --widget-card-bg: var(--studio-surface-elevated);
  --widget-icon-bg: color-mix(in srgb, var(--primary-color) 22%, white);
  --widget-icon-fg: var(--secondary-color);
  /* Tabs */
  --tab-strip-bg: #f0f2f7;
  /* Selection */
  --selection-ring: var(--secondary-color);
  --selection-glow: color-mix(in srgb, var(--primary-color) 50%, transparent);
  /* Empty State */
  --empty-icon-bg: color-mix(in srgb, var(--primary-color) 22%, white);
  --empty-title: var(--text-main);
  --empty-desc: #64748b;
  --empty-btn-bg: var(--secondary-color);
  --empty-btn-fg: #ffffff;
  --empty-btn-hover-bg: var(--primary-color);
  --empty-btn-hover-fg: var(--secondary-color);
  /* Section Controls */
  --sec-toolbar-bg: #f1f5f9;
  --el-action-bg: #e2e8f0;
  --col-empty-border: #94a3b8;
  /* Modal */
  --modal-overlay: rgba(15, 23, 42, 0.6);
  --modal-bg: var(--studio-surface);
  --modal-header-bg: #f8fafc;
  --modal-code-bg: #1e293b;
  --modal-code-text: #93c5fd;
  /* Scrollbar */
  --scrollbar-thumb: rgba(0, 0, 0, 0.15);
  --scrollbar-hover: color-mix(in srgb, var(--primary-color) 65%, transparent);
  /* Toast */
  --toast-bg: #ffffff;
  --toast-border: rgba(0, 0, 0, 0.12);
}

/* ─── DROP INDICATOR ───────────────────────────────── */
@keyframes dropIndicatorPulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.6;
    transform: scale(0.96);
  }
}
[data-continere-embed] {
  --embed-primary: #0f6b5c;
  --embed-primary-hover: #0c5548;
  --embed-primary-text: #ffffff;
  --embed-background: #f6f5f1;
  --embed-surface: #ffffff;
  --embed-text: #16211c;
  --embed-muted: #5c675f;
  --embed-border: #e2e4dd;
  --embed-error: #b23b30;
  --embed-error-bg: #fbeeec;
  --embed-success: #0f6b5c;
  --embed-focus-ring: #0f6b5c;
  --embed-primary-tint: color-mix(in srgb, var(--embed-primary) 12%, var(--embed-surface));
  --embed-primary-tint-strong: color-mix(in srgb, var(--embed-primary) 22%, var(--embed-surface));
  --embed-font: -apple-system, "Segoe UI", "Inter", ui-sans-serif, system-ui, sans-serif;
  --embed-font-mono: ui-monospace, "SFMono-Regular", Menlo, monospace;
  --embed-text-eyebrow: clamp(0.6875rem, 0.64rem + 0.2cqi, 0.75rem);
  --embed-text-caption: clamp(0.75rem, 0.71rem + 0.2cqi, 0.8125rem);
  --embed-text-body: clamp(1rem, 1rem + 0.25cqi, 1rem);
  --embed-text-label: clamp(0.8125rem, 0.78rem + 0.2cqi, 0.875rem);
  --embed-text-price: clamp(0.8125rem, 0.78rem + 0.2cqi, 0.9375rem);
  --embed-text-card-title: clamp(1rem, 0.94rem + 0.4cqi, 1.125rem);
  --embed-text-section-title: clamp(1.0625rem, 0.98rem + 0.5cqi, 1.25rem);
  --embed-text-page-title: clamp(1.25rem, 1.1rem + 1cqi, 1.75rem);
  --embed-text-button: clamp(0.8125rem, 0.78rem + 0.2cqi, 0.9375rem);
  --embed-leading-tight: 1.2;
  --embed-leading-normal: 1.5;
  --embed-tracking-eyebrow: 0.08em;
  --embed-space-3xs: 0.25rem;
  --embed-space-2xs: 0.375rem;
  --embed-space-xs: 0.5rem;
  --embed-space-sm: 0.75rem;
  --embed-space-md: 1rem;
  --embed-space-lg: 1.5rem;
  --embed-space-xl: 2rem;
  --embed-space-2xl: 2.5rem;
  --embed-radius: 0.625rem;
  --embed-radius-sm: 0.375rem;
  --embed-radius-pill: 999px;
  --embed-border-width: 1px;
  --embed-density: 1;
  --embed-pad-card: calc(1.25rem * var(--embed-density));
  --embed-pad-control: calc(0.75rem * var(--embed-density));
  --embed-gap-grid: calc(1rem * var(--embed-density));
  --embed-transition-fast: 120ms ease;
  --embed-transition-base: 180ms cubic-bezier(0.2, 0, 0, 1);
  --embed-shadow-card: 0 1px 2px rgba(16, 24, 20, 0.04);
  --embed-shadow-card-hover: 0 4px 16px rgba(16, 24, 20, 0.08);
  --embed-shadow-popover: 0 8px 30px rgba(16, 24, 20, 0.12);
}

[data-continere-embed][data-density=compact] {
  --embed-density: 0.72;
  --embed-space-lg: 1.125rem;
  --embed-space-xl: 1.5rem;
  --embed-space-2xl: 1.75rem;
}

@media (prefers-reduced-motion: reduce) {
  [data-continere-embed] {
    --embed-transition-fast: 0ms;
    --embed-transition-base: 0ms;
  }
}
[data-continere-embed] {
  all: initial;
  display: block;
  container-type: inline-size;
  container-name: continere-embed;
  box-sizing: border-box;
  font-family: var(--embed-font);
  font-size: 100%;
  line-height: var(--embed-leading-normal);
  color: var(--embed-text);
  background: var(--embed-background);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100%;
}
[data-continere-embed] *,
[data-continere-embed] *::before,
[data-continere-embed] *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}
[data-continere-embed] ul,
[data-continere-embed] ol {
  list-style: none;
}
[data-continere-embed] img,
[data-continere-embed] svg {
  display: block;
  max-width: 100%;
}
[data-continere-embed] button,
[data-continere-embed] input,
[data-continere-embed] select,
[data-continere-embed] textarea {
  background: none;
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
[data-continere-embed] button {
  cursor: pointer;
}
[data-continere-embed] button:disabled {
  cursor: not-allowed;
}
[data-continere-embed] a {
  text-decoration: none;
}
[data-continere-embed] :focus-visible {
  outline: 2px solid var(--embed-focus-ring);
  outline-offset: 2px;
  border-radius: var(--embed-radius-sm);
}
[data-continere-embed] input,
[data-continere-embed] select,
[data-continere-embed] textarea {
  font-size: max(1rem, var(--embed-text-body));
}

[data-continere-embed],
[data-continere-embed] * {
  overflow-wrap: break-word;
}

[data-continere-embed] {
  overflow-x: hidden;
}

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/fonts/BricolageGrotesque/BricolageGrotesque-VariableFont_opsz,wdth,wght.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-primary);
  background: var(--bg-page);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  letter-spacing: -0.32px;
  transition: background-color 0.25s ease, color 0.25s ease;
}

a {
  color: inherit;
  text-decoration: none;
}

.d1, .d2, .d3 {
  font-family: var(--font-display, "Bricolage Grotesque", "DM Sans", sans-serif);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.d1 {
  font-size: clamp(46px, 6.4vw, 92px);
  line-height: 1.04;
}

.d2 {
  font-size: clamp(34px, 4.6vw, 62px);
}

.d3 {
  font-size: clamp(24px, 3vw, 38px);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
html.hc {
  --bg-page: #ffffff;
  --bg-surface: #ffffff;
  --border: #000000;
  --text-primary: #000000;
  --text-secondary: #1a1a1a;
  --brand-green: #ffff00;
  --brand-yellow: #ffff00;
  --brand-blue: #ffffff;
  --brand-blue-l: #ffffff;
}
html.hc .card, html.hc .btn, html.hc .btn-sec {
  border: 2px solid #000 !important;
}

html.rm *,
html.rm *::before,
html.rm *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}

html.sf body,
html.sf body * {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html.ls body p,
html.ls body li,
html.ls body a,
html.ls body h1,
html.ls body h2,
html.ls body h3,
html.ls body h4 {
  line-height: 1.8 !important;
}

html.ls body p {
  margin-bottom: 14px;
}

html.bw body > * {
  filter: grayscale(1);
}

html.hl body a {
  text-decoration: underline !important;
  text-underline-offset: 3px;
  font-weight: 700 !important;
}

.headerEyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.headerDes {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
  margin-top: 5px;
}

.headerTitle {
  font-family: var(--font-primary);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--heading-color);
}
@media screen and (max-width: 767px) {
  .headerTitle {
    font-size: 19px;
  }
}
