/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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":"app/layout.tsx","import":"Marcellus","arguments":[{"subsets":["latin"],"weight":"400","variable":"--font-marcellus","display":"swap"}],"variableName":"marcellus"} ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* latin-ext */
@font-face {
  font-family: '__Marcellus_0ccb75';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/6a2830ad50e93808-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Marcellus_0ccb75';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/5924d7180a413da6-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: '__Marcellus_Fallback_0ccb75';src: local("Times New Roman");ascent-override: 86.59%;descent-override: 24.87%;line-gap-override: 0.00%;size-adjust: 112.50%
}.__className_0ccb75 {font-family: '__Marcellus_0ccb75', '__Marcellus_Fallback_0ccb75';font-weight: 400;font-style: normal
}.__variable_0ccb75 {--font-marcellus: '__Marcellus_0ccb75', '__Marcellus_Fallback_0ccb75'
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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":"app/layout.tsx","import":"Lato","arguments":[{"subsets":["latin"],"weight":["400","700"],"variable":"--font-lato","display":"swap"}],"variableName":"lato"} ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* latin-ext */
@font-face {
  font-family: '__Lato_47a102';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/cce080f35d014443-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Lato_47a102';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/_next/static/media/4de1fea1a954a5b6-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: '__Lato_47a102';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_next/static/media/39969fcf98a3026e-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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: '__Lato_47a102';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/_next/static/media/6d664cce900333ee-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: '__Lato_Fallback_47a102';src: local("Arial");ascent-override: 101.03%;descent-override: 21.80%;line-gap-override: 0.00%;size-adjust: 97.69%
}.__className_47a102 {font-family: '__Lato_47a102', '__Lato_Fallback_47a102';font-style: normal
}.__variable_47a102 {--font-lato: '__Lato_47a102', '__Lato_Fallback_47a102'
}

/*!**********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./styles/content-pages.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************/
/* ============================================================
   content-pages.css — stili pagine interne (Servizio / Patologia)
   Portato da ettore-bianconi-design-system/pages/pages.css.
   TUTTI i selettori sono scopati sotto .content-page per non
   collidere con globals.css / home / about. NON contiene reset
   globali (* , html, body). I token sotto sono solo quelli usati
   da queste regole; i font mappano alle famiglie next/font del
   progetto (--font-marcellus / --font-lato).
   ============================================================ */

:root {
  /* Colore */
  --paper:              #F1F0F0;
  --paper-warm:         #F6F4EB;
  --surface:            #FFFFFF;
  --ink:                #1C1C1C;
  --ink-2:              #4D4D4D;
  --ink-3:              #7D7D7D;
  --rule:               #E6E6E6;
  --brand-green:        #3C8C46;
  --brand-green-hover:  #2F7338;
  --brand-green-soft:   #5AA967;
  --brand-green-tint:   #DDE7DD;
  --brand-green-mint:   #EEF5EE;
  --forest:             #0A3C1E;

  /* Raggi + ombra */
  --r-card:   40px;
  --r-tile:   16px;
  --r-chip:   30px;
  --shadow-card: 0 24px 60px rgba(10, 60, 30, 0.12);

  /* Tipografia — mappata sulle famiglie next/font già caricate dal layout */
  --font-serif: var(--font-marcellus), "Marcellus", Georgia, serif;
  --font-sans:  var(--font-lato), "Lato", system-ui, -apple-system, sans-serif;
  --font-mono:  ui-monospace, "SF Mono", Menlo, monospace;
}

/* ============================================================
   Pages shared styles — Patologia + Servizio
   Built on top of colors_and_type.css + ui_kits/website/kit.css
   ============================================================ */

/* ----------  Page wrapper — top clearance per l'header sticky ---------- */
/* (era inline `paddingTop:140` sulle pagine; spostato qui così il tier-telefono lo può ridurre) */
.content-page { padding-top: 140px; }

/* ----------  Eyebrow chip (line + dot + label) — da colors_and_type.css ---------- */
.content-page .eyebrow {
  font-family: var(--font-serif);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: lowercase;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.content-page .eyebrow > .line {
  position: relative;
  width: 78px;
  height: 1.5px;
  background: var(--brand-green);
  flex-shrink: 0;
}
.content-page .eyebrow > .line::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--brand-green);
}
.content-page .eyebrow.on-dark { color: rgba(255, 255, 255, 0.92); }

/* ----------  Layout primitives ---------- */
.content-page .container {
  max-width: 1280px;
  margin: 0 auto;
  padding-left: 56px;
  padding-right: 56px;
}
.content-page .container-narrow {
  max-width: 880px;
  margin: 0 auto;
  padding-left: 56px;
  padding-right: 56px;
}
.content-page .section { padding: 96px 0; }
.content-page .section-tight { padding: 64px 0; }
.content-page .section-divider { border-bottom: 1px solid var(--rule); }

/* ----------  Page chrome (slimmer than home navbar) ---------- */
.content-page .site-top {
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
}
.content-page .site-top-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 0;
  gap: 32px;
}
.content-page .site-top .brand img { height: 44px; display: block; }
.content-page .site-top nav { display: flex; gap: 28px; }
.content-page .site-top nav a {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--ink-2);
  text-transform: lowercase;
  letter-spacing: 0.02em;
}
.content-page .site-top nav a.is-active { color: var(--brand-green); }
.content-page .site-top nav a:hover { color: var(--ink); }

/* ----------  Breadcrumb ---------- */
.content-page .breadcrumb {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
  padding: 32px 0 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.content-page .breadcrumb a { color: var(--ink-3); }
.content-page .breadcrumb a:hover { color: var(--brand-green); }
.content-page .breadcrumb .sep { opacity: 0.5; }
.content-page .breadcrumb .here { color: var(--ink); }

/* ----------  Hero ---------- */
.content-page .hero {
  padding: 48px 0 96px;
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 64px;
  align-items: end;
}
.content-page .hero.is-service { grid-template-columns: 1fr 0.78fr; }
.content-page .hero-eyebrow-row {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 28px;
}
.content-page .hero-zone {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.content-page .hero h1 {
  font-family: var(--font-serif);
  font-size: clamp(48px, 5.4vw, 78px);
  line-height: 1.02;
  letter-spacing: -0.012em;
  margin: 0;
  color: var(--ink);
  text-wrap: balance;
}
.content-page .hero h1 em {
  font-style: italic;
  color: var(--brand-green);
}
.content-page .hero-subtitle {
  font-family: var(--font-serif);
  font-size: 22px;
  font-style: italic;
  line-height: 1.35;
  color: var(--ink-2);
  margin-top: 18px;
}
.content-page .hero-intro {
  font-size: 18px;
  line-height: 1.55;
  color: var(--ink-2);
  margin-top: 28px;
  max-width: 520px;
}
.content-page .hero-ctas {
  display: flex;
  gap: 14px;
  margin-top: 36px;
  flex-wrap: wrap;
}
.content-page .trust-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}
.content-page .chip-trust {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--rule);
  background: var(--surface);
  font-size: 13px;
  color: var(--ink-2);
}
.content-page .chip-trust .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--brand-green);
}

.content-page .hero-art {
  position: relative;
  border-radius: var(--r-card);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  background: var(--brand-green-tint);
}
.content-page .hero-art.ratio-16-9 { aspect-ratio: 16 / 9; }
.content-page .hero-art.ratio-4-5 { aspect-ratio: 4 / 5; }
.content-page .hero-art img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; }
.content-page .hero-art-tag {
  position: absolute;
  left: 22px; bottom: 22px;
  background: rgba(10, 60, 30, 0.7);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 8px 12px;
  border-radius: 999px;
  backdrop-filter: blur(8px);
}

/* ----------  Buttons (mirrors kit.css, here for self-containment) ---------- */
.content-page .btn {
  display: inline-flex;
  align-items: center;
  padding: 4px 4px 4px 26px;
  height: 48px;
  border-radius: 30px;
  font-family: var(--font-serif);
  font-size: 16px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.content-page .btn .arrow {
  width: 40px; height: 40px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  margin-left: 16px;
}
.content-page .btn.primary { background: var(--brand-green); color: #fff; }
.content-page .btn.primary .arrow { background: var(--forest); color: #fff; }
.content-page .btn.primary:hover { background: var(--brand-green-hover); color: #fff; }
.content-page .btn.outline-dark { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.content-page .btn.outline-dark .arrow { background: var(--brand-green); color: #fff; }
.content-page .btn.outline-light { background: transparent; color: var(--paper); border: 1px solid var(--paper); }
.content-page .btn.outline-light .arrow { background: var(--brand-green); color: #fff; }

/* ----------  Section head ---------- */
.content-page .sec-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 56px;
}
.content-page .sec-head h2 {
  font-family: var(--font-serif);
  font-size: clamp(32px, 3vw, 44px);
  line-height: 1.08;
  margin: 18px 0 0;
  max-width: 640px;
  letter-spacing: -0.005em;
}
.content-page .sec-head p { color: var(--ink-2); max-width: 520px; margin-top: 14px; }
.content-page .sec-head.center { flex-direction: column; align-items: center; text-align: center; }
.content-page .sec-head.center h2 { text-align: center; }

/* ----------  Cos'è — single column rich text ---------- */
.content-page .prose {
  font-size: 18px;
  line-height: 1.65;
  color: var(--ink-2);
  max-width: 720px;
}
.content-page .prose p + p { margin-top: 18px; }
.content-page .prose strong { color: var(--ink); font-weight: 700; }

/* ----------  Sintomi list + side card ---------- */
.content-page .split-with-card {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 64px;
  align-items: start;
}
.content-page .symptom-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 32px;
}
.content-page .symptom-list li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink);
  padding: 18px 0;
  border-top: 1px solid var(--rule);
}
.content-page .symptom-list li:nth-child(-n+2) { border-top: 1px solid var(--ink); }
.content-page .symptom-list .num {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--brand-green);
  flex-shrink: 0;
  padding-top: 4px;
  min-width: 26px;
}
.content-page .side-card {
  border-radius: var(--r-card);
  overflow: hidden;
  background: var(--brand-green-tint);
  aspect-ratio: 1 / 1;
}
.content-page .side-card img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; }

/* ----------  Factor list (Perché non solo dove fa male) ---------- */
.content-page .factor-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.content-page .factor {
  background: var(--surface);
  border-radius: var(--r-tile);
  padding: 28px;
  border: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.content-page .factor .label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand-green);
}
.content-page .factor h3 {
  font-family: var(--font-serif);
  font-size: 22px;
  line-height: 1.2;
  margin: 0;
}
.content-page .factor p { color: var(--ink-2); font-size: 15px; line-height: 1.55; }

/* ----------  FOMO callout / forest dark section ---------- */
.content-page .forest-callout {
  background: var(--forest);
  color: var(--paper);
  border-radius: var(--r-card);
  padding: 80px 72px;
  position: relative;
  overflow: hidden;
}
.content-page .forest-callout .quote-mark {
  font-family: var(--font-serif);
  font-size: 200px;
  line-height: 1;
  color: var(--brand-green-soft);
  opacity: 0.22;
  position: absolute;
  top: 8px;
  left: 32px;
}
.content-page .forest-callout h2 {
  font-family: var(--font-serif);
  font-size: clamp(28px, 2.6vw, 40px);
  line-height: 1.18;
  color: #fff;
  margin: 0;
  max-width: 760px;
  position: relative;
}
.content-page .forest-callout h2 em {
  font-style: italic;
  color: var(--brand-green-soft);
}
.content-page .forest-callout .source {
  margin-top: 28px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  position: relative;
}

/* ----------  Pillars 2x2 (Come può aiutare il percorso) ---------- */
.content-page .pillar-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--rule);
  border-radius: var(--r-tile);
  overflow: hidden;
  border: 1px solid var(--rule);
}
.content-page .pillar {
  background: var(--surface);
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
}
.content-page .pillar::before {
  content: "";
  position: absolute;
  left: 36px; top: 40px;
  width: 32px; height: 1.5px;
  background: var(--brand-green);
}
.content-page .pillar .step {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand-green);
  margin-top: 18px;
}
.content-page .pillar h3 {
  font-family: var(--font-serif);
  font-size: 26px;
  margin: 0;
  line-height: 1.18;
}
.content-page .pillar p {
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
}

/* ----------  Chip-link grid (Patologie correlate) ---------- */
.content-page .chip-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.content-page .chip-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px 12px 18px;
  border-radius: var(--r-chip);
  background: var(--surface);
  border: 1px solid var(--rule);
  color: var(--ink);
  font-size: 15px;
  font-family: var(--font-sans);
  transition: all .2s ease;
}
.content-page .chip-link:hover {
  background: var(--brand-green-mint);
  border-color: var(--brand-green);
  color: var(--brand-green-hover);
}
.content-page .chip-link .arrow-mini {
  display: inline-flex;
  width: 18px; height: 18px;
  align-items: center; justify-content: center;
  color: var(--brand-green);
}

/* ----------  Card-link grid (Trattamenti consigliati / Collegamenti interni) ---------- */
.content-page .card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.content-page .card-link {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border-radius: var(--r-card);
  padding: 28px 28px 24px;
  text-decoration: none;
  color: inherit;
  border: 1px solid var(--rule);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position: relative;
  min-height: 280px;
}
.content-page .card-link:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
  border-color: transparent;
}
.content-page .card-link .card-icon {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--brand-green-mint);
  color: var(--brand-green);
  display: inline-flex;
  align-items: center; justify-content: center;
  margin-bottom: 22px;
}
.content-page .card-link h3 {
  font-family: var(--font-serif);
  font-size: 24px;
  line-height: 1.18;
  margin: 0;
}
.content-page .card-link p {
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-2);
  margin-top: 10px;
  flex: 1;
}
.content-page .card-link .card-cta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 22px;
  font-family: var(--font-serif);
  font-size: 14px;
  color: var(--brand-green);
}

/* ----------  FAQ ---------- */
.content-page .faq {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--ink);
}
.content-page .faq details {
  border-bottom: 1px solid var(--rule);
}
.content-page .faq summary {
  list-style: none;
  cursor: pointer;
  padding: 28px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-family: var(--font-serif);
  font-size: 22px;
  line-height: 1.3;
  color: var(--ink);
}
.content-page .faq summary::-webkit-details-marker { display: none; }
.content-page .faq summary .plus {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--brand-green);
  transition: transform .25s ease, background .2s ease, border-color .2s ease;
  font-size: 20px;
  font-family: var(--font-sans);
}
.content-page .faq details[open] summary .plus {
  transform: rotate(45deg);
  background: var(--brand-green);
  border-color: var(--brand-green);
  color: #fff;
}
.content-page .faq .answer {
  padding: 0 0 28px;
  max-width: 760px;
  color: var(--ink-2);
  font-size: 16px;
  line-height: 1.65;
}
.content-page .faq .answer p + p { margin-top: 12px; }

/* ----------  Final CTA ---------- */
.content-page .final-cta {
  background: var(--brand-green);
  color: #fff;
  border-radius: var(--r-card);
  padding: 72px 72px;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 48px;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.content-page .final-cta::after {
  content: "";
  position: absolute;
  right: -120px; top: -120px;
  width: 360px; height: 360px;
  border-radius: 50%;
  background: var(--brand-green-soft);
  opacity: 0.18;
}
.content-page .final-cta h2 {
  font-family: var(--font-serif);
  color: #fff;
  font-size: clamp(32px, 3vw, 46px);
  line-height: 1.08;
  margin: 0;
  position: relative;
}
.content-page .final-cta p {
  color: rgba(255, 255, 255, 0.85);
  margin-top: 18px;
  font-size: 16px;
  max-width: 480px;
  position: relative;
}
.content-page .final-cta .cta-side {
  text-align: right;
  position: relative;
}
.content-page .final-cta .btn.primary { background: #fff; color: var(--forest); }
.content-page .final-cta .btn.primary .arrow { background: var(--forest); color: #fff; }

/* ====================================================================
   SERVIZIO-specific blocks
   ==================================================================== */

/* Problem section (heading + side trust card) */
.content-page .problem-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 64px;
  align-items: start;
}
.content-page .problem-text { font-size: 18px; line-height: 1.6; color: var(--ink-2); }
.content-page .problem-text strong { color: var(--ink); font-weight: 700; }
.content-page .problem-text p + p { margin-top: 18px; }
.content-page .problem-card {
  background: var(--paper-warm);
  border-radius: var(--r-card);
  padding: 36px;
  border: 1px solid var(--rule);
}
.content-page .problem-card .label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand-green);
}
.content-page .problem-card h3 {
  font-family: var(--font-serif);
  font-size: 24px;
  line-height: 1.2;
  margin: 14px 0 0;
}
.content-page .problem-card p {
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.55;
  margin-top: 14px;
}
.content-page .problem-card .placeholder { margin-top: 22px; aspect-ratio: 1 / 1; }

/* Zone grid (A chi è utile) */
.content-page .zone-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.content-page .zone-card {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--r-tile);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 200px;
  transition: border-color .2s ease, transform .2s ease;
}
.content-page .zone-card:hover { border-color: var(--brand-green); transform: translateY(-2px); }
.content-page .zone-card h3 {
  font-family: var(--font-serif);
  font-size: 22px;
  margin: 0;
}
.content-page .zone-card .zone-num {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--brand-green);
}
.content-page .zone-card ul {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.content-page .zone-card ul li {
  font-size: 14px;
  color: var(--ink-2);
  padding-left: 14px;
  position: relative;
}
.content-page .zone-card ul li::before {
  content: "·";
  position: absolute;
  left: 2px; top: -2px;
  color: var(--brand-green);
  font-weight: 700;
  font-size: 18px;
}

/* Approccio — image left, text right with highlight */
.content-page .approach-grid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 64px;
  align-items: center;
}
.content-page .approach-art {
  border-radius: var(--r-card);
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--brand-green-tint);
}
.content-page .approach-text h3 {
  font-family: var(--font-serif);
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1.12;
  margin: 0;
}
.content-page .approach-text .highlight {
  margin-top: 28px;
  padding: 20px 24px;
  border-left: 3px solid var(--brand-green);
  background: var(--brand-green-mint);
  border-radius: 0 var(--r-tile) var(--r-tile) 0;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 20px;
  line-height: 1.4;
  color: var(--forest);
}
.content-page .approach-text p {
  margin-top: 22px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-2);
}

/* Fasi del percorso (numbered phases with connecting line) */
.content-page .phases {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  position: relative;
}
.content-page .phase {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 48px;
  padding: 36px 0;
  border-top: 1px solid var(--rule);
  position: relative;
}
.content-page .phase:first-child { border-top: 1px solid var(--ink); }
.content-page .phase .phase-num {
  font-family: var(--font-serif);
  font-size: 64px;
  line-height: 1;
  color: var(--brand-green);
  font-style: italic;
}
.content-page .phase h3 {
  font-family: var(--font-serif);
  font-size: 28px;
  line-height: 1.15;
  margin: 0 0 14px;
}
.content-page .phase p {
  font-size: 16px;
  color: var(--ink-2);
  line-height: 1.6;
  max-width: 640px;
}
.content-page .phase .duration {
  display: inline-block;
  margin-top: 16px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
  padding: 6px 12px;
  border: 1px solid var(--rule);
  border-radius: 999px;
}

/* Why-referto education section */
.content-page .referto {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 56px;
  align-items: center;
  background: var(--paper-warm);
  border-radius: var(--r-card);
  padding: 56px;
}
.content-page .referto h3 {
  font-family: var(--font-serif);
  font-size: clamp(26px, 2.4vw, 36px);
  line-height: 1.15;
  margin: 0;
}
.content-page .referto p {
  margin-top: 18px;
  font-size: 16px;
  color: var(--ink-2);
  line-height: 1.6;
}
.content-page .referto .highlight {
  margin-top: 24px;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 19px;
  color: var(--forest);
  line-height: 1.4;
  padding-left: 18px;
  border-left: 2px solid var(--brand-green);
}
.content-page .referto .placeholder { aspect-ratio: 4 / 3; }

/* Benefits list (Benefici realistici) */
.content-page .benefits {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 32px;
}
.content-page .benefit {
  display: flex;
  gap: 18px;
  padding: 20px 0;
  border-top: 1px solid var(--rule);
}
.content-page .benefit .check {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--brand-green-mint);
  color: var(--brand-green);
  display: inline-flex; align-items: center; justify-content: center;
}
.content-page .benefit h4 {
  font-family: var(--font-sans);
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--ink);
}
.content-page .benefit p {
  font-size: 14px;
  color: var(--ink-2);
  line-height: 1.55;
  margin: 0;
}
.content-page .benefits-microcopy {
  margin-top: 40px;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 22px;
  color: var(--forest);
  text-align: center;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
}

/* When to book signals */
.content-page .signals {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: start;
}
.content-page .signals-list { list-style: none; padding: 0; margin: 0; }
.content-page .signals-list li {
  display: flex;
  gap: 18px;
  padding: 22px 0;
  border-top: 1px solid var(--rule);
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink);
}
.content-page .signals-list li:first-child { border-top: 1px solid var(--ink); }
.content-page .signals-list .marker {
  flex-shrink: 0;
  width: 8px; height: 8px;
  margin-top: 12px;
  border-radius: 50%;
  background: var(--brand-green);
}
.content-page .signals-side {
  background: var(--forest);
  color: #fff;
  border-radius: var(--r-card);
  padding: 36px;
}
.content-page .signals-side h3 {
  font-family: var(--font-serif);
  color: #fff;
  font-size: 26px;
  line-height: 1.15;
  margin: 0;
}
.content-page .signals-side p {
  color: rgba(255, 255, 255, 0.78);
  margin-top: 14px;
  font-size: 15px;
  line-height: 1.55;
}
.content-page .signals-side .btn { margin-top: 26px; }

/* ----------  Image placeholder (subtle stripes + mono label) ---------- */
.content-page .placeholder {
  position: relative;
  width: 100%;
  border-radius: var(--r-card);
  overflow: hidden;
  background:
    repeating-linear-gradient(
      45deg,
      var(--brand-green-tint),
      var(--brand-green-tint) 12px,
      var(--brand-green-mint) 12px,
      var(--brand-green-mint) 24px
    );
  display: flex;
  align-items: center;
  justify-content: center;
}
.content-page .placeholder.tile { border-radius: var(--r-tile); }
.content-page .placeholder .ph-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--forest);
  background: rgba(255,255,255,0.85);
  padding: 8px 14px;
  border-radius: 999px;
  white-space: nowrap;
  max-width: 86%;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ----------  Footer mini ---------- */
.content-page .site-foot {
  margin-top: 96px;
  padding: 56px 0 48px;
  background: var(--forest);
  color: rgba(255,255,255,0.78);
}
.content-page .site-foot .foot-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
.content-page .site-foot img { height: 56px; }
.content-page .site-foot .legal {
  display: flex;
  gap: 24px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.content-page .site-foot .legal a { color: rgba(255,255,255,0.7); }
.content-page .site-foot .legal a:hover { color: #fff; }

/* ----------  Responsive (basic stack-down) ---------- */
@media (max-width: 960px) {
  .content-page .container, .content-page .container-narrow { padding-left: 28px; padding-right: 28px; }
  .content-page .hero,
  .content-page .hero.is-service,
  .content-page .split-with-card,
  .content-page .problem-grid,
  .content-page .approach-grid,
  .content-page .referto,
  .content-page .signals,
  .content-page .final-cta { grid-template-columns: 1fr; gap: 36px; }
  .content-page .pillar-grid,
  .content-page .factor-grid,
  .content-page .card-grid,
  .content-page .zone-grid,
  .content-page .benefits,
  .content-page .symptom-list { grid-template-columns: 1fr; }
  .content-page .forest-callout, .content-page .final-cta { padding: 48px 32px; }
  .content-page .phase { grid-template-columns: 60px 1fr; gap: 24px; }
  .content-page .phase .phase-num { font-size: 44px; }
  .content-page .section { padding: 64px 0; }
}

/* ----------  Tier-telefono (≤600px): comprime padding/gap interni ereditati
   dal desktop, che a 375–430px strozzano card e callout. Le griglie sono
   già collassate a 1 colonna dal blocco 960px qui sopra. ---------- */
@media (max-width: 600px) {
  /* clearance header + ritmo verticale */
  .content-page { padding-top: 84px; } /* barra mobile 64px + 20 respiro */
  .content-page .section { padding: 44px 0; }
  .content-page .hero { padding: 36px 0 52px; }
  .content-page .container, .content-page .container-narrow { padding-left: 20px; padding-right: 20px; }

  /* testate: evita il min 48px del clamp su schermi stretti */
  .content-page .hero h1 { font-size: clamp(34px, 8.5vw, 78px); }
  .content-page .hero-subtitle { font-size: 18px; }
  .content-page .hero-intro { font-size: 17px; margin-top: 22px; }

  /* card / callout: padding desktop troppo generosi */
  .content-page .referto { padding: 28px; }
  .content-page .pillar { padding: 26px 22px; }
  .content-page .factor { padding: 22px; }
  .content-page .problem-card { padding: 26px; }
  .content-page .zone-card { padding: 20px; }
  .content-page .signals-side { padding: 26px; }
  .content-page .forest-callout, .content-page .final-cta { padding: 36px 24px; }
  .content-page .final-cta .cta-side { padding: 24px; }
  .content-page .forest-callout .quote-mark { font-size: 44px; }

  /* gap dei contenitori a flusso e delle griglie collassate */
  .content-page .hero,
  .content-page .hero.is-service,
  .content-page .problem-grid,
  .content-page .approach-grid,
  .content-page .referto,
  .content-page .signals,
  .content-page .final-cta { gap: 24px; }
  .content-page .sec-head { gap: 20px; margin-bottom: 36px; }
  .content-page .pillar-grid,
  .content-page .factor-grid,
  .content-page .card-grid,
  .content-page .zone-grid,
  .content-page .benefits { gap: 16px; }

  /* dettagli */
  .content-page .phase { grid-template-columns: 44px 1fr; gap: 18px; }
  .content-page .phase .phase-num { font-size: 34px; }
  .content-page .breadcrumb { flex-wrap: wrap; }
}

@media (min-width: 601px) and (max-width: 1023px) {
  .content-page { padding-top: 96px; }
}

/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/*
! tailwindcss v3.4.13 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

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

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden] {
  display: none;
}
.container{
  width: 100%;
}
@media (min-width: 640px){

  .container{
    max-width: 640px;
  }
}
@media (min-width: 768px){

  .container{
    max-width: 768px;
  }
}
@media (min-width: 1024px){

  .container{
    max-width: 1024px;
  }
}
@media (min-width: 1280px){

  .container{
    max-width: 1280px;
  }
}
@media (min-width: 1536px){

  .container{
    max-width: 1536px;
  }
}
.pointer-events-none{
  pointer-events: none;
}
.visible{
  visibility: visible;
}
.static{
  position: static;
}
.fixed{
  position: fixed;
}
.absolute{
  position: absolute;
}
.relative{
  position: relative;
}
.sticky{
  position: sticky;
}
.inset-0{
  inset: 0px;
}
.inset-\[-0\.01\%_2\.77\%_1\.38\%_0\]{
  inset: -0.01% 2.77% 1.38% 0;
}
.inset-\[-0\.03\%_2\.81\%_1\.42\%_-0\.03\%\]{
  inset: -0.03% 2.81% 1.42% -0.03%;
}
.inset-\[-0\.3px_0\]{
  inset: -0.3px 0;
}
.inset-\[-0\.4px_0_0_0\]{
  inset: -0.4px 0 0 0;
}
.inset-\[-0\.6px_0_0_0\]{
  inset: -0.6px 0 0 0;
}
.inset-\[-0\.8px_0_0_0\]{
  inset: -0.8px 0 0 0;
}
.inset-\[-1px_0_0_0\]{
  inset: -1px 0 0 0;
}
.inset-\[0_-13\.33\%_-26\.67\%_-13\.33\%\]{
  inset: 0 -13.33% -26.67% -13.33%;
}
.inset-\[0_0_-0\.14\%_0\]{
  inset: 0 0 -0.14% 0;
}
.inset-\[0_0_-1\.77\%_0\]{
  inset: 0 0 -1.77% 0;
}
.inset-\[0_0_-1px_0\]{
  inset: 0 0 -1px 0;
}
.inset-\[0_18\.92\%_19\.23\%_18\.92\%\]{
  inset: 0 18.92% 19.23% 18.92%;
}
.inset-\[0_18\.92\%_51\.16\%_18\.92\%\]{
  inset: 0 18.92% 51.16% 18.92%;
}
.inset-\[0_18\.92\%_51\.16\%_51\.96\%\]{
  inset: 0 18.92% 51.16% 51.96%;
}
.inset-\[0_18\.92\%_83\.64\%_72\.66\%\]{
  inset: 0 18.92% 83.64% 72.66%;
}
.inset-\[0_2\.77\%_1\.37\%_0\.01\%\]{
  inset: 0 2.77% 1.37% 0.01%;
}
.inset-\[0_2\.78\%_1\.38\%_0\]{
  inset: 0 2.78% 1.38% 0;
}
.inset-\[0_2\.78\%_1\.39\%_0\]{
  inset: 0 2.78% 1.39% 0;
}
.inset-\[0_51\.96\%_51\.16\%_18\.92\%\]{
  inset: 0 51.96% 51.16% 18.92%;
}
.inset-\[0_72\.66\%_83\.64\%_18\.92\%\]{
  inset: 0 72.66% 83.64% 18.92%;
}
.inset-\[11\.29\%_45\.41\%_66\.42\%_45\.41\%\]{
  inset: 11.29% 45.41% 66.42% 45.41%;
}
.inset-\[11\.89\%_46\.67\%_85\.92\%_51\.61\%\]{
  inset: 11.89% 46.67% 85.92% 51.61%;
}
.inset-\[11\.89\%_51\.08\%_85\.92\%_47\.2\%\]{
  inset: 11.89% 51.08% 85.92% 47.2%;
}
.inset-\[13\.47\%_21\.75\%_80\.41\%_72\.66\%\]{
  inset: 13.47% 21.75% 80.41% 72.66%;
}
.inset-\[13\.47\%_72\.66\%_80\.41\%_21\.75\%\]{
  inset: 13.47% 72.66% 80.41% 21.75%;
}
.inset-\[13\.78\%_26\.92\%_0_26\.92\%\]{
  inset: 13.78% 26.92% 0 26.92%;
}
.inset-\[14\.71\%_48\.86\%_77\.85\%_48\.89\%\]{
  inset: 14.71% 48.86% 77.85% 48.89%;
}
.inset-\[14\.99\%_46\.99\%_80\.64\%_51\.13\%\]{
  inset: 14.99% 46.99% 80.64% 51.13%;
}
.inset-\[14\.99\%_50\.93\%_80\.64\%_47\.19\%\]{
  inset: 14.99% 50.93% 80.64% 47.19%;
}
.inset-\[15\.1\%_21\.82\%_51\.16\%_51\.96\%\]{
  inset: 15.1% 21.82% 51.16% 51.96%;
}
.inset-\[15\.1\%_51\.96\%_51\.16\%_21\.82\%\]{
  inset: 15.1% 51.96% 51.16% 21.82%;
}
.inset-\[15\.26\%_47\.7\%_83\%_51\.37\%\]{
  inset: 15.26% 47.7% 83% 51.37%;
}
.inset-\[15\.26\%_51\.63\%_84\.02\%_47\.98\%\]{
  inset: 15.26% 51.63% 84.02% 47.98%;
}
.inset-\[15\.33\%_51\.67\%_83\%_47\.44\%\]{
  inset: 15.33% 51.67% 83% 47.44%;
}
.inset-\[15\.67\%_51\.87\%_83\.42\%_47\.64\%\]{
  inset: 15.67% 51.87% 83.42% 47.64%;
}
.inset-\[16\.41\%_52\.11\%_83\.14\%_47\.64\%\]{
  inset: 16.41% 52.11% 83.14% 47.64%;
}
.inset-\[17\%_46\.46\%_79\.39\%_46\.9\%\]{
  inset: 17% 46.46% 79.39% 46.9%;
}
.inset-\[18\.43\%_0_5\.62\%_74\.92\%\]{
  inset: 18.43% 0 5.62% 74.92%;
}
.inset-\[18\.43\%_74\.92\%_5\.62\%_0\]{
  inset: 18.43% 74.92% 5.62% 0;
}
.inset-\[18\.51\%_42\.57\%_76\.58\%_42\.57\%\]{
  inset: 18.51% 42.57% 76.58% 42.57%;
}
.inset-\[18\.51\%_42\.57\%_76\.58\%_55\.01\%\]{
  inset: 18.51% 42.57% 76.58% 55.01%;
}
.inset-\[18\.51\%_55\.01\%_76\.58\%_42\.57\%\]{
  inset: 18.51% 55.01% 76.58% 42.57%;
}
.inset-\[19\.12\%_22\.38\%_76\.93\%_76\.36\%\]{
  inset: 19.12% 22.38% 76.93% 76.36%;
}
.inset-\[19\.27\%_22\.5\%_76\.79\%_76\.24\%\]{
  inset: 19.27% 22.5% 76.79% 76.24%;
}
.inset-\[19\.27\%_76\.24\%_76\.79\%_22\.5\%\]{
  inset: 19.27% 76.24% 76.79% 22.5%;
}
.inset-\[2\.11\%_0\]{
  inset: 2.11% 0;
}
.inset-\[2\.35\%_0\]{
  inset: 2.35% 0;
}
.inset-\[21\.81\%_46\.69\%_68\.32\%_46\.73\%\]{
  inset: 21.81% 46.69% 68.32% 46.73%;
}
.inset-\[23\.97\%_37\.39\%_19\.23\%_37\.39\%\]{
  inset: 23.97% 37.39% 19.23% 37.39%;
}
.inset-\[24\.12\%_42\.6\%_41\.4\%_42\.6\%\]{
  inset: 24.12% 42.6% 41.4% 42.6%;
}
.inset-\[24\.54\%_47\.55\%_69\.82\%_47\.32\%\]{
  inset: 24.54% 47.55% 69.82% 47.32%;
}
.inset-\[30\.61\%_7\.66\%_66\.35\%_90\.68\%\]{
  inset: 30.61% 7.66% 66.35% 90.68%;
}
.inset-\[36\.25\%_42\.09\%_60\.84\%_56\.27\%\]{
  inset: 36.25% 42.09% 60.84% 56.27%;
}
.inset-\[36\.50\%_41\.25\%_54\.61\%_41\.25\%\]{
  inset: 36.50% 41.25% 54.61% 41.25%;
}
.inset-\[42\.62\%_40\.47\%_43\.44\%_54\.11\%\]{
  inset: 42.62% 40.47% 43.44% 54.11%;
}
.inset-\[5\.5\%_42\.57\%_68\.32\%_42\.57\%\]{
  inset: 5.5% 42.57% 68.32% 42.57%;
}
.inset-\[5\.5\%_44\.08\%_68\.32\%_44\.11\%\]{
  inset: 5.5% 44.08% 68.32% 44.11%;
}
.inset-\[54\.09\%_7\.76\%_42\.87\%_90\.57\%\]{
  inset: 54.09% 7.76% 42.87% 90.57%;
}
.inset-\[60\.67\%_49\.32\%_24\.35\%_49\.32\%\]{
  inset: 60.67% 49.32% 24.35% 49.32%;
}
.inset-\[60\.67\%_49\.32\%_37\.58\%_49\.32\%\]{
  inset: 60.67% 49.32% 37.58% 49.32%;
}
.inset-\[65\.87\%_7\.76\%_31\.08\%_90\.57\%\]{
  inset: 65.87% 7.76% 31.08% 90.57%;
}
.inset-\[69\.63\%_42\.23\%_19\.23\%_41\.77\%\]{
  inset: 69.63% 42.23% 19.23% 41.77%;
}
.inset-\[73\.9\%_49\.32\%_24\.35\%_49\.32\%\]{
  inset: 73.9% 49.32% 24.35% 49.32%;
}
.inset-\[77\.66\%_7\.66\%_19\.3\%_90\.68\%\]{
  inset: 77.66% 7.66% 19.3% 90.68%;
}
.inset-\[8\.33\%_8\.34\%_8\.33\%_8\.33\%\]{
  inset: 8.33% 8.34% 8.33% 8.33%;
}
.inset-\[8\.89\%_43\.77\%_75\.14\%_54\.15\%\]{
  inset: 8.89% 43.77% 75.14% 54.15%;
}
.inset-\[8\.89\%_54\.3\%_75\.14\%_43\.61\%\]{
  inset: 8.89% 54.3% 75.14% 43.61%;
}
.inset-x-0{
  left: 0px;
  right: 0px;
}
.inset-y-0{
  top: 0px;
  bottom: 0px;
}
.-bottom-\[15px\]{
  bottom: -15px;
}
.-left-\[15px\]{
  left: -15px;
}
.-right-\[15px\]{
  right: -15px;
}
.-top-\[14px\]{
  top: -14px;
}
.-top-\[15px\]{
  top: -15px;
}
.-top-\[8px\]{
  top: -8px;
}
.bottom-0{
  bottom: 0px;
}
.bottom-\[10px\]{
  bottom: 10px;
}
.bottom-\[22px\]{
  bottom: 22px;
}
.bottom-\[24px\]{
  bottom: 24px;
}
.bottom-\[26px\]{
  bottom: 26px;
}
.bottom-\[28px\]{
  bottom: 28px;
}
.bottom-\[52px\]{
  bottom: 52px;
}
.left-0{
  left: 0px;
}
.left-1\/2{
  left: 50%;
}
.left-\[1008px\]{
  left: 1008px;
}
.left-\[1009px\]{
  left: 1009px;
}
.left-\[1041px\]{
  left: 1041px;
}
.left-\[10px\]{
  left: 10px;
}
.left-\[12\.69px\]{
  left: 12.69px;
}
.left-\[12px\]{
  left: 12px;
}
.left-\[1386px\]{
  left: 1386px;
}
.left-\[145\.4px\]{
  left: 145.4px;
}
.left-\[145px\]{
  left: 145px;
}
.left-\[147\.1px\]{
  left: 147.1px;
}
.left-\[147px\]{
  left: 147px;
}
.left-\[148px\]{
  left: 148px;
}
.left-\[165px\]{
  left: 165px;
}
.left-\[166px\]{
  left: 166px;
}
.left-\[16px\]{
  left: 16px;
}
.left-\[1705px\]{
  left: 1705px;
}
.left-\[171px\]{
  left: 171px;
}
.left-\[173px\]{
  left: 173px;
}
.left-\[176px\]{
  left: 176px;
}
.left-\[185px\]{
  left: 185px;
}
.left-\[188\.69px\]{
  left: 188.69px;
}
.left-\[194px\]{
  left: 194px;
}
.left-\[202px\]{
  left: 202px;
}
.left-\[203px\]{
  left: 203px;
}
.left-\[20px\]{
  left: 20px;
}
.left-\[219px\]{
  left: 219px;
}
.left-\[239px\]{
  left: 239px;
}
.left-\[246px\]{
  left: 246px;
}
.left-\[24px\]{
  left: 24px;
}
.left-\[257px\]{
  left: 257px;
}
.left-\[26px\]{
  left: 26px;
}
.left-\[28px\]{
  left: 28px;
}
.left-\[30px\]{
  left: 30px;
}
.left-\[31px\]{
  left: 31px;
}
.left-\[3px\]{
  left: 3px;
}
.left-\[409\.5px\]{
  left: 409.5px;
}
.left-\[409px\]{
  left: 409px;
}
.left-\[416px\]{
  left: 416px;
}
.left-\[495px\]{
  left: 495px;
}
.left-\[49px\]{
  left: 49px;
}
.left-\[680px\]{
  left: 680px;
}
.left-\[693px\]{
  left: 693px;
}
.left-\[765px\]{
  left: 765px;
}
.left-\[85\.5px\]{
  left: 85.5px;
}
.left-\[880px\]{
  left: 880px;
}
.left-\[940px\]{
  left: 940px;
}
.left-\[980px\]{
  left: 980px;
}
.left-\[calc\(16\.67\%\+122px\)\]{
  left: calc(16.67% + 122px);
}
.left-\[calc\(16\.67\%\+197px\)\]{
  left: calc(16.67% + 197px);
}
.left-\[calc\(16\.67\%\+250px\)\]{
  left: calc(16.67% + 250px);
}
.left-\[calc\(16\.67\%\+88px\)\]{
  left: calc(16.67% + 88px);
}
.left-\[calc\(25\%\+104px\)\]{
  left: calc(25% + 104px);
}
.left-\[calc\(25\%\+115px\)\]{
  left: calc(25% + 115px);
}
.left-\[calc\(25\%\+55px\)\]{
  left: calc(25% + 55px);
}
.left-\[calc\(25\%\+78px\)\]{
  left: calc(25% + 78px);
}
.left-\[calc\(25\%\+79px\)\]{
  left: calc(25% + 79px);
}
.left-\[calc\(25\%\+88px\)\]{
  left: calc(25% + 88px);
}
.left-\[calc\(33\.33\%\+114px\)\]{
  left: calc(33.33% + 114px);
}
.left-\[calc\(33\.33\%\+133px\)\]{
  left: calc(33.33% + 133px);
}
.left-\[calc\(33\.33\%\+321\.5px\)\]{
  left: calc(33.33% + 321.5px);
}
.left-\[calc\(33\.33\%\+32px\)\]{
  left: calc(33.33% + 32px);
}
.left-\[calc\(33\.33\%\+56px\)\]{
  left: calc(33.33% + 56px);
}
.left-\[calc\(33\.33\%\+57px\)\]{
  left: calc(33.33% + 57px);
}
.left-\[calc\(33\.33\%\+85px\)\]{
  left: calc(33.33% + 85px);
}
.left-\[calc\(41\.67\%\+101px\)\]{
  left: calc(41.67% + 101px);
}
.left-\[calc\(41\.67\%\+161px\)\]{
  left: calc(41.67% + 161px);
}
.left-\[calc\(41\.67\%\+33px\)\]{
  left: calc(41.67% + 33px);
}
.left-\[calc\(41\.67\%\+62px\)\]{
  left: calc(41.67% + 62px);
}
.left-\[calc\(41\.67\%\+73px\)\]{
  left: calc(41.67% + 73px);
}
.left-\[calc\(41\.67\%\+86px\)\]{
  left: calc(41.67% + 86px);
}
.left-\[calc\(50\%\+0\.5px\)\]{
  left: calc(50% + 0.5px);
}
.left-\[calc\(50\%\+107px\)\]{
  left: calc(50% + 107px);
}
.left-\[calc\(50\%\+114px\)\]{
  left: calc(50% + 114px);
}
.left-\[calc\(50\%\+12px\)\]{
  left: calc(50% + 12px);
}
.left-\[calc\(50\%\+17px\)\]{
  left: calc(50% + 17px);
}
.left-\[calc\(50\%\+1px\)\]{
  left: calc(50% + 1px);
}
.left-\[calc\(50\%\+23px\)\]{
  left: calc(50% + 23px);
}
.left-\[calc\(50\%\+3px\)\]{
  left: calc(50% + 3px);
}
.left-\[calc\(50\%\+72px\)\]{
  left: calc(50% + 72px);
}
.left-\[calc\(50\%\+74px\)\]{
  left: calc(50% + 74px);
}
.left-\[calc\(50\%-401px\)\]{
  left: calc(50% - 401px);
}
.left-\[calc\(50\%-68\.5px\)\]{
  left: calc(50% - 68.5px);
}
.left-\[calc\(58\.33\%\+39px\)\]{
  left: calc(58.33% + 39px);
}
.left-\[calc\(58\.33\%\+41px\)\]{
  left: calc(58.33% + 41px);
}
.left-\[calc\(58\.33\%\+96px\)\]{
  left: calc(58.33% + 96px);
}
.left-\[calc\(58\.33\%-10px\)\]{
  left: calc(58.33% - 10px);
}
.left-\[calc\(58\.33\%-28px\)\]{
  left: calc(58.33% - 28px);
}
.left-\[calc\(66\.67\%\+24px\)\]{
  left: calc(66.67% + 24px);
}
.left-\[calc\(66\.67\%\+25px\)\]{
  left: calc(66.67% + 25px);
}
.left-\[calc\(66\.67\%\+64px\)\]{
  left: calc(66.67% + 64px);
}
.left-\[calc\(66\.67\%-31px\)\]{
  left: calc(66.67% - 31px);
}
.left-\[calc\(66\.67\%-32px\)\]{
  left: calc(66.67% - 32px);
}
.left-\[calc\(75\%\+36px\)\]{
  left: calc(75% + 36px);
}
.left-\[calc\(75\%-25px\)\]{
  left: calc(75% - 25px);
}
.left-\[calc\(75\%-48px\)\]{
  left: calc(75% - 48px);
}
.left-\[calc\(75\%-54px\)\]{
  left: calc(75% - 54px);
}
.left-\[calc\(75\%-55px\)\]{
  left: calc(75% - 55px);
}
.left-\[calc\(75\%-68px\)\]{
  left: calc(75% - 68px);
}
.left-\[calc\(75\%-76\.96px\)\]{
  left: calc(75% - 76.96px);
}
.left-\[calc\(79\.17\%-55px\)\]{
  left: calc(79.17% - 55px);
}
.left-\[calc\(8\.33\%\+139px\)\]{
  left: calc(8.33% + 139px);
}
.left-\[calc\(8\.33\%\+164px\)\]{
  left: calc(8.33% + 164px);
}
.left-\[calc\(8\.33\%\+189px\)\]{
  left: calc(8.33% + 189px);
}
.left-\[calc\(8\.33\%\+190px\)\]{
  left: calc(8.33% + 190px);
}
.left-\[calc\(8\.33\%\+249px\)\]{
  left: calc(8.33% + 249px);
}
.right-0{
  right: 0px;
}
.right-\[10px\]{
  right: 10px;
}
.right-\[12px\]{
  right: 12px;
}
.right-\[145px\]{
  right: 145px;
}
.right-\[14px\]{
  right: 14px;
}
.right-\[16px\]{
  right: 16px;
}
.right-\[22px\]{
  right: 22px;
}
.right-\[24px\]{
  right: 24px;
}
.right-\[28px\]{
  right: 28px;
}
.right-\[7px\]{
  right: 7px;
}
.top-0{
  top: 0px;
}
.top-1\/2{
  top: 50%;
}
.top-\[1022px\]{
  top: 1022px;
}
.top-\[105px\]{
  top: 105px;
}
.top-\[1105px\]{
  top: 1105px;
}
.top-\[1180px\]{
  top: 1180px;
}
.top-\[1187px\]{
  top: 1187px;
}
.top-\[1191px\]{
  top: 1191px;
}
.top-\[12\.36px\]{
  top: 12.36px;
}
.top-\[1208px\]{
  top: 1208px;
}
.top-\[120px\]{
  top: 120px;
}
.top-\[1226px\]{
  top: 1226px;
}
.top-\[12px\]{
  top: 12px;
}
.top-\[1334px\]{
  top: 1334px;
}
.top-\[1341px\]{
  top: 1341px;
}
.top-\[1446px\]{
  top: 1446px;
}
.top-\[16\.36px\]{
  top: 16.36px;
}
.top-\[160px\]{
  top: 160px;
}
.top-\[1611px\]{
  top: 1611px;
}
.top-\[1624px\]{
  top: 1624px;
}
.top-\[1640px\]{
  top: 1640px;
}
.top-\[164px\]{
  top: 164px;
}
.top-\[1676px\]{
  top: 1676px;
}
.top-\[1683px\]{
  top: 1683px;
}
.top-\[16px\]{
  top: 16px;
}
.top-\[170px\]{
  top: 170px;
}
.top-\[1759px\]{
  top: 1759px;
}
.top-\[1834px\]{
  top: 1834px;
}
.top-\[1862px\]{
  top: 1862px;
}
.top-\[18px\]{
  top: 18px;
}
.top-\[193px\]{
  top: 193px;
}
.top-\[1949px\]{
  top: 1949px;
}
.top-\[19px\]{
  top: 19px;
}
.top-\[2037px\]{
  top: 2037px;
}
.top-\[20px\]{
  top: 20px;
}
.top-\[2186px\]{
  top: 2186px;
}
.top-\[2198px\]{
  top: 2198px;
}
.top-\[226px\]{
  top: 226px;
}
.top-\[2270px\]{
  top: 2270px;
}
.top-\[2278px\]{
  top: 2278px;
}
.top-\[2317px\]{
  top: 2317px;
}
.top-\[231px\]{
  top: 231px;
}
.top-\[2326px\]{
  top: 2326px;
}
.top-\[232px\]{
  top: 232px;
}
.top-\[2330px\]{
  top: 2330px;
}
.top-\[2361px\]{
  top: 2361px;
}
.top-\[2363px\]{
  top: 2363px;
}
.top-\[2413px\]{
  top: 2413px;
}
.top-\[2450px\]{
  top: 2450px;
}
.top-\[24px\]{
  top: 24px;
}
.top-\[2500px\]{
  top: 2500px;
}
.top-\[2508px\]{
  top: 2508px;
}
.top-\[2524px\]{
  top: 2524px;
}
.top-\[2540px\]{
  top: 2540px;
}
.top-\[2543px\]{
  top: 2543px;
}
.top-\[2544px\]{
  top: 2544px;
}
.top-\[2549px\]{
  top: 2549px;
}
.top-\[2584px\]{
  top: 2584px;
}
.top-\[2586px\]{
  top: 2586px;
}
.top-\[264px\]{
  top: 264px;
}
.top-\[2673px\]{
  top: 2673px;
}
.top-\[270px\]{
  top: 270px;
}
.top-\[2731px\]{
  top: 2731px;
}
.top-\[2763px\]{
  top: 2763px;
}
.top-\[2772px\]{
  top: 2772px;
}
.top-\[2807px\]{
  top: 2807px;
}
.top-\[2809px\]{
  top: 2809px;
}
.top-\[2820px\]{
  top: 2820px;
}
.top-\[2896px\]{
  top: 2896px;
}
.top-\[28px\]{
  top: 28px;
}
.top-\[2982px\]{
  top: 2982px;
}
.top-\[300px\]{
  top: 300px;
}
.top-\[3037px\]{
  top: 3037px;
}
.top-\[308px\]{
  top: 308px;
}
.top-\[30px\]{
  top: 30px;
}
.top-\[3102\.01px\]{
  top: 3102.01px;
}
.top-\[3132px\]{
  top: 3132px;
}
.top-\[315px\]{
  top: 315px;
}
.top-\[3165px\]{
  top: 3165px;
}
.top-\[3211px\]{
  top: 3211px;
}
.top-\[3225px\]{
  top: 3225px;
}
.top-\[3230px\]{
  top: 3230px;
}
.top-\[3390px\]{
  top: 3390px;
}
.top-\[3450px\]{
  top: 3450px;
}
.top-\[3500px\]{
  top: 3500px;
}
.top-\[3741\.02px\]{
  top: 3741.02px;
}
.top-\[3758\.02px\]{
  top: 3758.02px;
}
.top-\[3759px\]{
  top: 3759px;
}
.top-\[3824px\]{
  top: 3824px;
}
.top-\[39px\]{
  top: 39px;
}
.top-\[3px\]{
  top: 3px;
}
.top-\[4002px\]{
  top: 4002px;
}
.top-\[4049\.02px\]{
  top: 4049.02px;
}
.top-\[4066\.02px\]{
  top: 4066.02px;
}
.top-\[4213\.02px\]{
  top: 4213.02px;
}
.top-\[4409px\]{
  top: 4409px;
}
.top-\[4px\]{
  top: 4px;
}
.top-\[520px\]{
  top: 520px;
}
.top-\[521px\]{
  top: 521px;
}
.top-\[526px\]{
  top: 526px;
}
.top-\[527px\]{
  top: 527px;
}
.top-\[530px\]{
  top: 530px;
}
.top-\[533px\]{
  top: 533px;
}
.top-\[548px\]{
  top: 548px;
}
.top-\[54px\]{
  top: 54px;
}
.top-\[554px\]{
  top: 554px;
}
.top-\[555px\]{
  top: 555px;
}
.top-\[582px\]{
  top: 582px;
}
.top-\[583px\]{
  top: 583px;
}
.top-\[5876px\]{
  top: 5876px;
}
.top-\[5916px\]{
  top: 5916px;
}
.top-\[59px\]{
  top: 59px;
}
.top-\[6097px\]{
  top: 6097px;
}
.top-\[6115px\]{
  top: 6115px;
}
.top-\[612px\]{
  top: 612px;
}
.top-\[6152px\]{
  top: 6152px;
}
.top-\[615px\]{
  top: 615px;
}
.top-\[6220px\]{
  top: 6220px;
}
.top-\[636px\]{
  top: 636px;
}
.top-\[641px\]{
  top: 641px;
}
.top-\[644px\]{
  top: 644px;
}
.top-\[6519px\]{
  top: 6519px;
}
.top-\[655px\]{
  top: 655px;
}
.top-\[6579px\]{
  top: 6579px;
}
.top-\[6581px\]{
  top: 6581px;
}
.top-\[6599px\]{
  top: 6599px;
}
.top-\[6601px\]{
  top: 6601px;
}
.top-\[6774px\]{
  top: 6774px;
}
.top-\[679px\]{
  top: 679px;
}
.top-\[694px\]{
  top: 694px;
}
.top-\[7597px\]{
  top: 7597px;
}
.top-\[7620px\]{
  top: 7620px;
}
.top-\[763px\]{
  top: 763px;
}
.top-\[769px\]{
  top: 769px;
}
.top-\[7700px\]{
  top: 7700px;
}
.top-\[770px\]{
  top: 770px;
}
.top-\[787\.54px\]{
  top: 787.54px;
}
.top-\[7900px\]{
  top: 7900px;
}
.top-\[7946px\]{
  top: 7946px;
}
.top-\[7991px\]{
  top: 7991px;
}
.top-\[802px\]{
  top: 802px;
}
.top-\[803px\]{
  top: 803px;
}
.top-\[812px\]{
  top: 812px;
}
.top-\[8160px\]{
  top: 8160px;
}
.top-\[852px\]{
  top: 852px;
}
.top-\[8880px\]{
  top: 8880px;
}
.top-\[894px\]{
  top: 894px;
}
.top-\[8px\]{
  top: 8px;
}
.top-\[920px\]{
  top: 920px;
}
.top-\[952px\]{
  top: 952px;
}
.top-\[95px\]{
  top: 95px;
}
.top-\[966px\]{
  top: 966px;
}
.top-\[970px\]{
  top: 970px;
}
.top-\[985px\]{
  top: 985px;
}
.isolate{
  isolation: isolate;
}
.z-10{
  z-index: 10;
}
.z-20{
  z-index: 20;
}
.z-50{
  z-index: 50;
}
.z-\[5\]{
  z-index: 5;
}
.z-\[60\]{
  z-index: 60;
}
.z-\[70\]{
  z-index: 70;
}
.z-\[9999\]{
  z-index: 9999;
}
.mx-auto{
  margin-left: auto;
  margin-right: auto;
}
.-ml-\[14px\]{
  margin-left: -14px;
}
.-mt-\[24px\]{
  margin-top: -24px;
}
.mb-0{
  margin-bottom: 0px;
}
.mb-\[10px\]{
  margin-bottom: 10px;
}
.mb-\[12px\]{
  margin-bottom: 12px;
}
.mb-\[14px\]{
  margin-bottom: 14px;
}
.mb-\[16px\]{
  margin-bottom: 16px;
}
.mb-\[18px\]{
  margin-bottom: 18px;
}
.mb-\[28px\]{
  margin-bottom: 28px;
}
.mb-\[48px\]{
  margin-bottom: 48px;
}
.mb-\[6px\]{
  margin-bottom: 6px;
}
.mb-\[8px\]{
  margin-bottom: 8px;
}
.ml-0{
  margin-left: 0px;
}
.ml-\[25px\]{
  margin-left: 25px;
}
.ml-\[2px\]{
  margin-left: 2px;
}
.ml-\[3px\]{
  margin-left: 3px;
}
.mr-\[8px\]{
  margin-right: 8px;
}
.mt-0{
  margin-top: 0px;
}
.mt-\[10px\]{
  margin-top: 10px;
}
.mt-\[12px\]{
  margin-top: 12px;
}
.mt-\[14px\]{
  margin-top: 14px;
}
.mt-\[16px\]{
  margin-top: 16px;
}
.mt-\[18px\]{
  margin-top: 18px;
}
.mt-\[20px\]{
  margin-top: 20px;
}
.mt-\[22px\]{
  margin-top: 22px;
}
.mt-\[24px\]{
  margin-top: 24px;
}
.mt-\[28px\]{
  margin-top: 28px;
}
.mt-\[2px\]{
  margin-top: 2px;
}
.mt-\[36px\]{
  margin-top: 36px;
}
.mt-\[40px\]{
  margin-top: 40px;
}
.mt-\[48px\]{
  margin-top: 48px;
}
.mt-\[4px\]{
  margin-top: 4px;
}
.mt-\[56px\]{
  margin-top: 56px;
}
.mt-\[6px\]{
  margin-top: 6px;
}
.mt-\[72px\]{
  margin-top: 72px;
}
.mt-\[8px\]{
  margin-top: 8px;
}
.mt-\[clamp\(12px\2c 3vw\2c 24px\)\]{
  margin-top: clamp(12px,3vw,24px);
}
.mt-\[clamp\(16px\2c 4vw\2c 32px\)\]{
  margin-top: clamp(16px,4vw,32px);
}
.mt-\[clamp\(8px\2c 2vw\2c 16px\)\]{
  margin-top: clamp(8px,2vw,16px);
}
.mt-\[clamp\(24px\2c 6vw\2c 36px\)\]{
  margin-top: clamp(24px,6vw,36px);
}
.mt-auto{
  margin-top: auto;
}
.line-clamp-2{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.line-clamp-3{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.block{
  display: block;
}
.inline-block{
  display: inline-block;
}
.flex{
  display: flex;
}
.inline-flex{
  display: inline-flex;
}
.grid{
  display: grid;
}
.inline-grid{
  display: inline-grid;
}
.contents{
  display: contents;
}
.hidden{
  display: none;
}
.aspect-\[16\/9\]{
  aspect-ratio: 16/9;
}
.aspect-\[2\/3\]{
  aspect-ratio: 2/3;
}
.aspect-\[279\/100\]{
  aspect-ratio: 279/100;
}
.aspect-\[4\/3\]{
  aspect-ratio: 4/3;
}
.aspect-\[4\/5\]{
  aspect-ratio: 4/5;
}
.aspect-square{
  aspect-ratio: 1 / 1;
}
.size-\[13px\]{
  width: 13px;
  height: 13px;
}
.size-\[14\.614px\]{
  width: 14.614px;
  height: 14.614px;
}
.size-\[14px\]{
  width: 14px;
  height: 14px;
}
.size-\[150px\]{
  width: 150px;
  height: 150px;
}
.size-\[15px\]{
  width: 15px;
  height: 15px;
}
.size-\[16\.739px\]{
  width: 16.739px;
  height: 16.739px;
}
.size-\[160px\]{
  width: 160px;
  height: 160px;
}
.size-\[16px\]{
  width: 16px;
  height: 16px;
}
.size-\[18px\]{
  width: 18px;
  height: 18px;
}
.size-\[19\.15px\]{
  width: 19.15px;
  height: 19.15px;
}
.size-\[20px\]{
  width: 20px;
  height: 20px;
}
.size-\[21\.92px\]{
  width: 21.92px;
  height: 21.92px;
}
.size-\[22px\]{
  width: 22px;
  height: 22px;
}
.size-\[24px\]{
  width: 24px;
  height: 24px;
}
.size-\[26px\]{
  width: 26px;
  height: 26px;
}
.size-\[28px\]{
  width: 28px;
  height: 28px;
}
.size-\[300px\]{
  width: 300px;
  height: 300px;
}
.size-\[30px\]{
  width: 30px;
  height: 30px;
}
.size-\[32px\]{
  width: 32px;
  height: 32px;
}
.size-\[34px\]{
  width: 34px;
  height: 34px;
}
.size-\[36px\]{
  width: 36px;
  height: 36px;
}
.size-\[38px\]{
  width: 38px;
  height: 38px;
}
.size-\[40px\]{
  width: 40px;
  height: 40px;
}
.size-\[42px\]{
  width: 42px;
  height: 42px;
}
.size-\[44px\]{
  width: 44px;
  height: 44px;
}
.size-\[46px\]{
  width: 46px;
  height: 46px;
}
.size-\[48px\]{
  width: 48px;
  height: 48px;
}
.size-\[50px\]{
  width: 50px;
  height: 50px;
}
.size-\[56px\]{
  width: 56px;
  height: 56px;
}
.size-\[60px\]{
  width: 60px;
  height: 60px;
}
.size-\[64px\]{
  width: 64px;
  height: 64px;
}
.size-\[72px\]{
  width: 72px;
  height: 72px;
}
.size-\[80px\]{
  width: 80px;
  height: 80px;
}
.size-\[84px\]{
  width: 84px;
  height: 84px;
}
.size-\[99px\]{
  width: 99px;
  height: 99px;
}
.size-full{
  width: 100%;
  height: 100%;
}
.h-0{
  height: 0px;
}
.h-\[100cqh\]{
  height: 100cqh;
}
.h-\[1052px\]{
  height: 1052px;
}
.h-\[1142px\]{
  height: 1142px;
}
.h-\[1164px\]{
  height: 1164px;
}
.h-\[117px\]{
  height: 117px;
}
.h-\[11px\]{
  height: 11px;
}
.h-\[13px\]{
  height: 13px;
}
.h-\[159px\]{
  height: 159px;
}
.h-\[167px\]{
  height: 167px;
}
.h-\[16px\]{
  height: 16px;
}
.h-\[1723px\]{
  height: 1723px;
}
.h-\[176px\]{
  height: 176px;
}
.h-\[193px\]{
  height: 193px;
}
.h-\[208px\]{
  height: 208px;
}
.h-\[221px\]{
  height: 221px;
}
.h-\[2320px\]{
  height: 2320px;
}
.h-\[232px\]{
  height: 232px;
}
.h-\[24px\]{
  height: 24px;
}
.h-\[2px\]{
  height: 2px;
}
.h-\[300px\]{
  height: 300px;
}
.h-\[308px\]{
  height: 308px;
}
.h-\[325px\]{
  height: 325px;
}
.h-\[32px\]{
  height: 32px;
}
.h-\[347px\]{
  height: 347px;
}
.h-\[367px\]{
  height: 367px;
}
.h-\[368px\]{
  height: 368px;
}
.h-\[36px\]{
  height: 36px;
}
.h-\[376px\]{
  height: 376px;
}
.h-\[394px\]{
  height: 394px;
}
.h-\[3px\]{
  height: 3px;
}
.h-\[40px\]{
  height: 40px;
}
.h-\[464px\]{
  height: 464px;
}
.h-\[48px\]{
  height: 48px;
}
.h-\[4px\]{
  height: 4px;
}
.h-\[50px\]{
  height: 50px;
}
.h-\[513px\]{
  height: 513px;
}
.h-\[52px\]{
  height: 52px;
}
.h-\[550px\]{
  height: 550px;
}
.h-\[554\.39px\]{
  height: 554.39px;
}
.h-\[55px\]{
  height: 55px;
}
.h-\[56px\]{
  height: 56px;
}
.h-\[578px\]{
  height: 578px;
}
.h-\[583px\]{
  height: 583px;
}
.h-\[58px\]{
  height: 58px;
}
.h-\[600px\]{
  height: 600px;
}
.h-\[60px\]{
  height: 60px;
}
.h-\[624px\]{
  height: 624px;
}
.h-\[62px\]{
  height: 62px;
}
.h-\[630px\]{
  height: 630px;
}
.h-\[63px\]{
  height: 63px;
}
.h-\[640px\]{
  height: 640px;
}
.h-\[64px\]{
  height: 64px;
}
.h-\[672px\]{
  height: 672px;
}
.h-\[674px\]{
  height: 674px;
}
.h-\[70px\]{
  height: 70px;
}
.h-\[740px\]{
  height: 740px;
}
.h-\[750px\]{
  height: 750px;
}
.h-\[78\%\]{
  height: 78%;
}
.h-\[8\.667px\]{
  height: 8.667px;
}
.h-\[80px\]{
  height: 80px;
}
.h-\[874px\]{
  height: 874px;
}
.h-auto{
  height: auto;
}
.h-full{
  height: 100%;
}
.h-px{
  height: 1px;
}
.h-\[56\%\]{
  height: 56%;
}
.max-h-\[560px\]{
  max-height: 560px;
}
.min-h-\[210px\]{
  min-height: 210px;
}
.min-h-\[38px\]{
  min-height: 38px;
}
.min-h-\[460px\]{
  min-height: 460px;
}
.w-0{
  width: 0px;
}
.w-\[1000px\]{
  width: 1000px;
}
.w-\[100cqw\]{
  width: 100cqw;
}
.w-\[1010px\]{
  width: 1010px;
}
.w-\[1022px\]{
  width: 1022px;
}
.w-\[1034px\]{
  width: 1034px;
}
.w-\[1035\.65px\]{
  width: 1035.65px;
}
.w-\[1041px\]{
  width: 1041px;
}
.w-\[1062px\]{
  width: 1062px;
}
.w-\[1079px\]{
  width: 1079px;
}
.w-\[1080px\]{
  width: 1080px;
}
.w-\[108px\]{
  width: 108px;
}
.w-\[1100px\]{
  width: 1100px;
}
.w-\[1103px\]{
  width: 1103px;
}
.w-\[127px\]{
  width: 127px;
}
.w-\[12px\]{
  width: 12px;
}
.w-\[1383px\]{
  width: 1383px;
}
.w-\[138px\]{
  width: 138px;
}
.w-\[143px\]{
  width: 143px;
}
.w-\[1440px\]{
  width: 1440px;
}
.w-\[147px\]{
  width: 147px;
}
.w-\[156px\]{
  width: 156px;
}
.w-\[1628px\]{
  width: 1628px;
}
.w-\[1630px\]{
  width: 1630px;
}
.w-\[165px\]{
  width: 165px;
}
.w-\[170px\]{
  width: 170px;
}
.w-\[180px\]{
  width: 180px;
}
.w-\[189px\]{
  width: 189px;
}
.w-\[18px\]{
  width: 18px;
}
.w-\[1920px\]{
  width: 1920px;
}
.w-\[205px\]{
  width: 205px;
}
.w-\[21\.176px\]{
  width: 21.176px;
}
.w-\[210px\]{
  width: 210px;
}
.w-\[215px\]{
  width: 215px;
}
.w-\[216px\]{
  width: 216px;
}
.w-\[220px\]{
  width: 220px;
}
.w-\[222px\]{
  width: 222px;
}
.w-\[230px\]{
  width: 230px;
}
.w-\[234px\]{
  width: 234px;
}
.w-\[242px\]{
  width: 242px;
}
.w-\[248px\]{
  width: 248px;
}
.w-\[24px\]{
  width: 24px;
}
.w-\[250px\]{
  width: 250px;
}
.w-\[259px\]{
  width: 259px;
}
.w-\[270px\]{
  width: 270px;
}
.w-\[292px\]{
  width: 292px;
}
.w-\[300px\]{
  width: 300px;
}
.w-\[301px\]{
  width: 301px;
}
.w-\[304px\]{
  width: 304px;
}
.w-\[305px\]{
  width: 305px;
}
.w-\[30px\]{
  width: 30px;
}
.w-\[318px\]{
  width: 318px;
}
.w-\[320px\]{
  width: 320px;
}
.w-\[352px\]{
  width: 352px;
}
.w-\[358px\]{
  width: 358px;
}
.w-\[360px\]{
  width: 360px;
}
.w-\[383px\]{
  width: 383px;
}
.w-\[385px\]{
  width: 385px;
}
.w-\[389px\]{
  width: 389px;
}
.w-\[390px\]{
  width: 390px;
}
.w-\[395px\]{
  width: 395px;
}
.w-\[40px\]{
  width: 40px;
}
.w-\[410px\]{
  width: 410px;
}
.w-\[413px\]{
  width: 413px;
}
.w-\[415px\]{
  width: 415px;
}
.w-\[420px\]{
  width: 420px;
}
.w-\[427px\]{
  width: 427px;
}
.w-\[428px\]{
  width: 428px;
}
.w-\[464px\]{
  width: 464px;
}
.w-\[470px\]{
  width: 470px;
}
.w-\[471px\]{
  width: 471px;
}
.w-\[48px\]{
  width: 48px;
}
.w-\[492\.188px\]{
  width: 492.188px;
}
.w-\[527px\]{
  width: 527px;
}
.w-\[528px\]{
  width: 528px;
}
.w-\[536px\]{
  width: 536px;
}
.w-\[552px\]{
  width: 552px;
}
.w-\[560px\]{
  width: 560px;
}
.w-\[58px\]{
  width: 58px;
}
.w-\[592px\]{
  width: 592px;
}
.w-\[600px\]{
  width: 600px;
}
.w-\[60px\]{
  width: 60px;
}
.w-\[620px\]{
  width: 620px;
}
.w-\[624px\]{
  width: 624px;
}
.w-\[660px\]{
  width: 660px;
}
.w-\[689px\]{
  width: 689px;
}
.w-\[68px\]{
  width: 68px;
}
.w-\[720px\]{
  width: 720px;
}
.w-\[722px\]{
  width: 722px;
}
.w-\[741px\]{
  width: 741px;
}
.w-\[744px\]{
  width: 744px;
}
.w-\[765px\]{
  width: 765px;
}
.w-\[770px\]{
  width: 770px;
}
.w-\[800px\]{
  width: 800px;
}
.w-\[803px\]{
  width: 803px;
}
.w-\[82\%\]{
  width: 82%;
}
.w-\[820px\]{
  width: 820px;
}
.w-\[840px\]{
  width: 840px;
}
.w-\[843px\]{
  width: 843px;
}
.w-\[862px\]{
  width: 862px;
}
.w-\[878px\]{
  width: 878px;
}
.w-\[880px\]{
  width: 880px;
}
.w-\[89px\]{
  width: 89px;
}
.w-\[900px\]{
  width: 900px;
}
.w-\[903px\]{
  width: 903px;
}
.w-\[910px\]{
  width: 910px;
}
.w-\[920px\]{
  width: 920px;
}
.w-\[923px\]{
  width: 923px;
}
.w-\[min-content\]{
  width: -moz-min-content;
  width: min-content;
}
.w-auto{
  width: auto;
}
.w-full{
  width: 100%;
}
.w-px{
  width: 1px;
}
.w-\[78vw\]{
  width: 78vw;
}
.min-w-0{
  min-width: 0px;
}
.min-w-full{
  min-width: 100%;
}
.max-w-\[300px\]{
  max-width: 300px;
}
.max-w-\[340px\]{
  max-width: 340px;
}
.max-w-\[360px\]{
  max-width: 360px;
}
.max-w-\[40rem\]{
  max-width: 40rem;
}
.max-w-\[460px\]{
  max-width: 460px;
}
.max-w-\[480px\]{
  max-width: 480px;
}
.max-w-\[520px\]{
  max-width: 520px;
}
.max-w-\[560px\]{
  max-width: 560px;
}
.max-w-\[575px\]{
  max-width: 575px;
}
.max-w-\[600px\]{
  max-width: 600px;
}
.max-w-\[640px\]{
  max-width: 640px;
}
.max-w-\[700px\]{
  max-width: 700px;
}
.max-w-\[720px\]{
  max-width: 720px;
}
.max-w-\[760px\]{
  max-width: 760px;
}
.max-w-\[780px\]{
  max-width: 780px;
}
.max-w-\[92vw\]{
  max-width: 92vw;
}
.max-w-none{
  max-width: none;
}
.flex-1{
  flex: 1 1 0%;
}
.flex-none{
  flex: none;
}
.shrink-0{
  flex-shrink: 0;
}
.basis-0{
  flex-basis: 0px;
}
.-translate-x-1\/2{
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2{
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-0{
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-2{
  --tw-translate-x: 0.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-rotate-180{
  --tw-rotate: -180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-rotate-45{
  --tw-rotate: -45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-180{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-45{
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-scale-x-100{
  --tw-scale-x: -1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-scale-y-100{
  --tw-scale-y: -1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.animate-\[storyFill_5s_linear_forwards\]{
  animation: storyFill 5s linear forwards;
}
.cursor-pointer{
  cursor: pointer;
}
.select-none{
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize-none{
  resize: none;
}
.resize{
  resize: both;
}
.snap-x{
  scroll-snap-type: x var(--tw-scroll-snap-strictness);
}
.snap-mandatory{
  --tw-scroll-snap-strictness: mandatory;
}
.snap-start{
  scroll-snap-align: start;
}
.scroll-mt-\[120px\]{
  scroll-margin-top: 120px;
}
.list-none{
  list-style-type: none;
}
.appearance-none{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.grid-cols-1{
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-\[max-content\]{
  grid-template-columns: max-content;
}
.grid-cols-\[repeat\(2\2c minmax\(0\2c 1fr\)\)\]{
  grid-template-columns: repeat(2,minmax(0,1fr));
}
.grid-rows-3{
  grid-template-rows: repeat(3, minmax(0, 1fr));
}
.grid-rows-\[max-content\]{
  grid-template-rows: max-content;
}
.grid-rows-\[repeat\(4\2c minmax\(0\2c 1fr\)\)\]{
  grid-template-rows: repeat(4,minmax(0,1fr));
}
.flex-col{
  flex-direction: column;
}
.flex-wrap{
  flex-wrap: wrap;
}
.place-items-start{
  place-items: start;
}
.place-items-center{
  place-items: center;
}
.content-stretch{
  align-content: stretch;
}
.items-start{
  align-items: flex-start;
}
.items-end{
  align-items: flex-end;
}
.items-center{
  align-items: center;
}
.items-baseline{
  align-items: baseline;
}
.items-stretch{
  align-items: stretch;
}
.justify-end{
  justify-content: flex-end;
}
.justify-center{
  justify-content: center;
}
.justify-between{
  justify-content: space-between;
}
.gap-\[10px\]{
  gap: 10px;
}
.gap-\[12px\]{
  gap: 12px;
}
.gap-\[14px\]{
  gap: 14px;
}
.gap-\[16px\]{
  gap: 16px;
}
.gap-\[17px\]{
  gap: 17px;
}
.gap-\[18px\]{
  gap: 18px;
}
.gap-\[20px\]{
  gap: 20px;
}
.gap-\[22px\]{
  gap: 22px;
}
.gap-\[23px\]{
  gap: 23px;
}
.gap-\[24px\]{
  gap: 24px;
}
.gap-\[26px\]{
  gap: 26px;
}
.gap-\[28px\]{
  gap: 28px;
}
.gap-\[29px\]{
  gap: 29px;
}
.gap-\[30px\]{
  gap: 30px;
}
.gap-\[31px\]{
  gap: 31px;
}
.gap-\[32px\]{
  gap: 32px;
}
.gap-\[35px\]{
  gap: 35px;
}
.gap-\[36px\]{
  gap: 36px;
}
.gap-\[39px\]{
  gap: 39px;
}
.gap-\[40px\]{
  gap: 40px;
}
.gap-\[48px\]{
  gap: 48px;
}
.gap-\[4px\]{
  gap: 4px;
}
.gap-\[5px\]{
  gap: 5px;
}
.gap-\[60px\]{
  gap: 60px;
}
.gap-\[64px\]{
  gap: 64px;
}
.gap-\[66px\]{
  gap: 66px;
}
.gap-\[67px\]{
  gap: 67px;
}
.gap-\[6px\]{
  gap: 6px;
}
.gap-\[8px\]{
  gap: 8px;
}
.gap-\[clamp\(20px\2c 4\.5vw\2c 32px\)\]{
  gap: clamp(20px,4.5vw,32px);
}
.gap-\[clamp\(20px\2c 5vw\2c 36px\)\]{
  gap: clamp(20px,5vw,36px);
}
.gap-\[clamp\(14px\2c 3\.5vw\2c 20px\)\]{
  gap: clamp(14px,3.5vw,20px);
}
.gap-x-\[20px\]{
  -moz-column-gap: 20px;
       column-gap: 20px;
}
.gap-x-\[24px\]{
  -moz-column-gap: 24px;
       column-gap: 24px;
}
.gap-x-\[8px\]{
  -moz-column-gap: 8px;
       column-gap: 8px;
}
.gap-x-\[clamp\(16px\2c 4vw\2c 32px\)\]{
  -moz-column-gap: clamp(16px,4vw,32px);
       column-gap: clamp(16px,4vw,32px);
}
.gap-y-\[16px\]{
  row-gap: 16px;
}
.gap-y-\[18px\]{
  row-gap: 18px;
}
.gap-y-\[24px\]{
  row-gap: 24px;
}
.gap-y-\[8px\]{
  row-gap: 8px;
}
.gap-y-\[clamp\(28px\2c 6vw\2c 44px\)\]{
  row-gap: clamp(28px,6vw,44px);
}
.self-start{
  align-self: flex-start;
}
.self-stretch{
  align-self: stretch;
}
.overflow-hidden{
  overflow: hidden;
}
.overflow-clip{
  overflow: clip;
}
.overflow-x-auto{
  overflow-x: auto;
}
.overflow-y-auto{
  overflow-y: auto;
}
.text-ellipsis{
  text-overflow: ellipsis;
}
.whitespace-nowrap{
  white-space: nowrap;
}
.whitespace-pre{
  white-space: pre;
}
.whitespace-pre-wrap{
  white-space: pre-wrap;
}
.break-words{
  overflow-wrap: break-word;
}
.break-all{
  word-break: break-all;
}
.rounded-\[10px\]{
  border-radius: 10px;
}
.rounded-\[12px\]{
  border-radius: 12px;
}
.rounded-\[14px\]{
  border-radius: 14px;
}
.rounded-\[16px\]{
  border-radius: 16px;
}
.rounded-\[18px\]{
  border-radius: 18px;
}
.rounded-\[20px\]{
  border-radius: 20px;
}
.rounded-\[24px\]{
  border-radius: 24px;
}
.rounded-\[28px\]{
  border-radius: 28px;
}
.rounded-\[30px\]{
  border-radius: 30px;
}
.rounded-\[32px\]{
  border-radius: 32px;
}
.rounded-\[34px\]{
  border-radius: 34px;
}
.rounded-\[36px\]{
  border-radius: 36px;
}
.rounded-\[40px\]{
  border-radius: 40px;
}
.rounded-\[4px\]{
  border-radius: 4px;
}
.rounded-\[8px\]{
  border-radius: 8px;
}
.rounded-full{
  border-radius: 9999px;
}
.rounded-t-\[40px\]{
  border-top-left-radius: 40px;
  border-top-right-radius: 40px;
}
.rounded-t-\[64px\]{
  border-top-left-radius: 64px;
  border-top-right-radius: 64px;
}
.rounded-bl-\[40px\]{
  border-bottom-left-radius: 40px;
}
.rounded-tl-\[40px\]{
  border-top-left-radius: 40px;
}
.border{
  border-width: 1px;
}
.border-0{
  border-width: 0px;
}
.border-2{
  border-width: 2px;
}
.border-\[0\.58px\]{
  border-width: 0.58px;
}
.border-\[0\.6px\]{
  border-width: 0.6px;
}
.border-\[1\.008px\]{
  border-width: 1.008px;
}
.border-b{
  border-bottom-width: 1px;
}
.border-t{
  border-top-width: 1px;
}
.border-solid{
  border-style: solid;
}
.border-\[\#0A3C1E\]\/10{
  border-color: rgb(10 60 30 / 0.1);
}
.border-\[\#0A3C1E\]\/15{
  border-color: rgb(10 60 30 / 0.15);
}
.border-\[\#15482A\]{
  --tw-border-opacity: 1;
  border-color: rgb(21 72 42 / var(--tw-border-opacity));
}
.border-\[\#1c1c1c\]{
  --tw-border-opacity: 1;
  border-color: rgb(28 28 28 / var(--tw-border-opacity));
}
.border-\[\#3C8C46\]{
  --tw-border-opacity: 1;
  border-color: rgb(60 140 70 / var(--tw-border-opacity));
}
.border-\[\#3C8C46\]\/12{
  border-color: rgb(60 140 70 / 0.12);
}
.border-\[\#3C8C46\]\/15{
  border-color: rgb(60 140 70 / 0.15);
}
.border-\[\#3C8C46\]\/30{
  border-color: rgb(60 140 70 / 0.3);
}
.border-\[\#4d4d4d\]{
  --tw-border-opacity: 1;
  border-color: rgb(77 77 77 / var(--tw-border-opacity));
}
.border-\[\#dde7dd\]{
  --tw-border-opacity: 1;
  border-color: rgb(221 231 221 / var(--tw-border-opacity));
}
.border-\[\#f1f0f0\]{
  --tw-border-opacity: 1;
  border-color: rgb(241 240 240 / var(--tw-border-opacity));
}
.border-\[\#f1f0f0\]\/40{
  border-color: rgb(241 240 240 / 0.4);
}
.border-black{
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0 / var(--tw-border-opacity));
}
.border-black\/10{
  border-color: rgb(0 0 0 / 0.1);
}
.border-black\/5{
  border-color: rgb(0 0 0 / 0.05);
}
.border-white\/10{
  border-color: rgb(255 255 255 / 0.1);
}
.border-white\/12{
  border-color: rgb(255 255 255 / 0.12);
}
.border-white\/15{
  border-color: rgb(255 255 255 / 0.15);
}
.border-white\/20{
  border-color: rgb(255 255 255 / 0.2);
}
.border-white\/25{
  border-color: rgb(255 255 255 / 0.25);
}
.border-white\/40{
  border-color: rgb(255 255 255 / 0.4);
}
.bg-\[\#07261A\]{
  --tw-bg-opacity: 1;
  background-color: rgb(7 38 26 / var(--tw-bg-opacity));
}
.bg-\[\#0A3C1E\]{
  --tw-bg-opacity: 1;
  background-color: rgb(10 60 30 / var(--tw-bg-opacity));
}
.bg-\[\#15482A\]{
  --tw-bg-opacity: 1;
  background-color: rgb(21 72 42 / var(--tw-bg-opacity));
}
.bg-\[\#1F5538\]{
  --tw-bg-opacity: 1;
  background-color: rgb(31 85 56 / var(--tw-bg-opacity));
}
.bg-\[\#1c1c1c\]\/10{
  background-color: rgb(28 28 28 / 0.1);
}
.bg-\[\#3C8C46\]{
  --tw-bg-opacity: 1;
  background-color: rgb(60 140 70 / var(--tw-bg-opacity));
}
.bg-\[\#3C8C46\]\/10{
  background-color: rgb(60 140 70 / 0.1);
}
.bg-\[\#3C8C46\]\/20{
  background-color: rgb(60 140 70 / 0.2);
}
.bg-\[\#3C8C46\]\/8{
  background-color: rgb(60 140 70 / 0.08);
}
.bg-\[\#5AA967\]{
  --tw-bg-opacity: 1;
  background-color: rgb(90 169 103 / var(--tw-bg-opacity));
}
.bg-\[\#5AA967\]\/15{
  background-color: rgb(90 169 103 / 0.15);
}
.bg-\[\#DDE7DD\]{
  --tw-bg-opacity: 1;
  background-color: rgb(221 231 221 / var(--tw-bg-opacity));
}
.bg-\[\#F1F0F0\]{
  --tw-bg-opacity: 1;
  background-color: rgb(241 240 240 / var(--tw-bg-opacity));
}
.bg-\[\#d9d9d9\]{
  --tw-bg-opacity: 1;
  background-color: rgb(217 217 217 / var(--tw-bg-opacity));
}
.bg-\[\#f1f0f0\]{
  --tw-bg-opacity: 1;
  background-color: rgb(241 240 240 / var(--tw-bg-opacity));
}
.bg-\[\#f1f0f0\]\/40{
  background-color: rgb(241 240 240 / 0.4);
}
.bg-\[rgba\(0\2c 0\2c 0\2c 0\.2\)\]{
  background-color: rgba(0,0,0,0.2);
}
.bg-\[rgba\(60\2c 140\2c 70\2c 0\.2\)\]{
  background-color: rgba(60,140,70,0.2);
}
.bg-black\/25{
  background-color: rgb(0 0 0 / 0.25);
}
.bg-black\/30{
  background-color: rgb(0 0 0 / 0.3);
}
.bg-black\/40{
  background-color: rgb(0 0 0 / 0.4);
}
.bg-black\/60{
  background-color: rgb(0 0 0 / 0.6);
}
.bg-black\/\[0\.06\]{
  background-color: rgb(0 0 0 / 0.06);
}
.bg-transparent{
  background-color: transparent;
}
.bg-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-white\/10{
  background-color: rgb(255 255 255 / 0.1);
}
.bg-white\/15{
  background-color: rgb(255 255 255 / 0.15);
}
.bg-white\/20{
  background-color: rgb(255 255 255 / 0.2);
}
.bg-white\/30{
  background-color: rgb(255 255 255 / 0.3);
}
.bg-white\/40{
  background-color: rgb(255 255 255 / 0.4);
}
.bg-white\/55{
  background-color: rgb(255 255 255 / 0.55);
}
.bg-white\/70{
  background-color: rgb(255 255 255 / 0.7);
}
.bg-white\/8{
  background-color: rgb(255 255 255 / 0.08);
}
.bg-white\/\[0\.04\]{
  background-color: rgb(255 255 255 / 0.04);
}
.bg-gradient-to-t{
  background-image: linear-gradient(to top, var(--tw-gradient-stops));
}
.from-black\/70{
  --tw-gradient-from: rgb(0 0 0 / 0.7) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.from-black\/75{
  --tw-gradient-from: rgb(0 0 0 / 0.75) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-black\/10{
  --tw-gradient-to: rgb(0 0 0 / 0)  var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), rgb(0 0 0 / 0.1) var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-black\/25{
  --tw-gradient-to: rgb(0 0 0 / 0.25) var(--tw-gradient-to-position);
}
.to-black\/30{
  --tw-gradient-to: rgb(0 0 0 / 0.3) var(--tw-gradient-to-position);
}
.bg-cover{
  background-size: cover;
}
.bg-center{
  background-position: center;
}
.object-contain{
  -o-object-fit: contain;
     object-fit: contain;
}
.object-cover{
  -o-object-fit: cover;
     object-fit: cover;
}
.p-\[10px\]{
  padding: 10px;
}
.p-\[16px\]{
  padding: 16px;
}
.p-\[20px\]{
  padding: 20px;
}
.p-\[24px\]{
  padding: 24px;
}
.p-\[28px\]{
  padding: 28px;
}
.p-\[30px\]{
  padding: 30px;
}
.p-\[3px\]{
  padding: 3px;
}
.p-\[48px\]{
  padding: 48px;
}
.p-\[56px\]{
  padding: 56px;
}
.p-\[5px\]{
  padding: 5px;
}
.p-\[6px\]{
  padding: 6px;
}
.p-\[8px\]{
  padding: 8px;
}
.p-\[22px\]{
  padding: 22px;
}
.px-\[10px\]{
  padding-left: 10px;
  padding-right: 10px;
}
.px-\[12px\]{
  padding-left: 12px;
  padding-right: 12px;
}
.px-\[14px\]{
  padding-left: 14px;
  padding-right: 14px;
}
.px-\[16px\]{
  padding-left: 16px;
  padding-right: 16px;
}
.px-\[18px\]{
  padding-left: 18px;
  padding-right: 18px;
}
.px-\[20px\]{
  padding-left: 20px;
  padding-right: 20px;
}
.px-\[22px\]{
  padding-left: 22px;
  padding-right: 22px;
}
.px-\[24px\]{
  padding-left: 24px;
  padding-right: 24px;
}
.px-\[26px\]{
  padding-left: 26px;
  padding-right: 26px;
}
.px-\[30px\]{
  padding-left: 30px;
  padding-right: 30px;
}
.px-\[36px\]{
  padding-left: 36px;
  padding-right: 36px;
}
.px-\[40px\]{
  padding-left: 40px;
  padding-right: 40px;
}
.px-\[48px\]{
  padding-left: 48px;
  padding-right: 48px;
}
.px-\[4px\]{
  padding-left: 4px;
  padding-right: 4px;
}
.px-\[60px\]{
  padding-left: 60px;
  padding-right: 60px;
}
.px-\[7px\]{
  padding-left: 7px;
  padding-right: 7px;
}
.px-\[8px\]{
  padding-left: 8px;
  padding-right: 8px;
}
.py-\[10px\]{
  padding-top: 10px;
  padding-bottom: 10px;
}
.py-\[12px\]{
  padding-top: 12px;
  padding-bottom: 12px;
}
.py-\[14px\]{
  padding-top: 14px;
  padding-bottom: 14px;
}
.py-\[16px\]{
  padding-top: 16px;
  padding-bottom: 16px;
}
.py-\[18px\]{
  padding-top: 18px;
  padding-bottom: 18px;
}
.py-\[20px\]{
  padding-top: 20px;
  padding-bottom: 20px;
}
.py-\[24px\]{
  padding-top: 24px;
  padding-bottom: 24px;
}
.py-\[3px\]{
  padding-top: 3px;
  padding-bottom: 3px;
}
.py-\[50px\]{
  padding-top: 50px;
  padding-bottom: 50px;
}
.py-\[5px\]{
  padding-top: 5px;
  padding-bottom: 5px;
}
.py-\[60px\]{
  padding-top: 60px;
  padding-bottom: 60px;
}
.py-\[64px\]{
  padding-top: 64px;
  padding-bottom: 64px;
}
.py-\[6px\]{
  padding-top: 6px;
  padding-bottom: 6px;
}
.py-\[7px\]{
  padding-top: 7px;
  padding-bottom: 7px;
}
.py-\[80px\]{
  padding-top: 80px;
  padding-bottom: 80px;
}
.py-\[8px\]{
  padding-top: 8px;
  padding-bottom: 8px;
}
.px-\[clamp\(20px\2c 5vw\2c 40px\)\]{
  padding-left: clamp(20px,5vw,40px);
  padding-right: clamp(20px,5vw,40px);
}
.pb-\[110px\]{
  padding-bottom: 110px;
}
.pb-\[22px\]{
  padding-bottom: 22px;
}
.pb-\[28px\]{
  padding-bottom: 28px;
}
.pb-\[30px\]{
  padding-bottom: 30px;
}
.pb-\[36px\]{
  padding-bottom: 36px;
}
.pb-\[44px\]{
  padding-bottom: 44px;
}
.pb-\[64px\]{
  padding-bottom: 64px;
}
.pl-\[24px\]{
  padding-left: 24px;
}
.pl-\[26px\]{
  padding-left: 26px;
}
.pl-\[28px\]{
  padding-left: 28px;
}
.pl-\[30px\]{
  padding-left: 30px;
}
.pl-\[32px\]{
  padding-left: 32px;
}
.pl-\[76px\]{
  padding-left: 76px;
}
.pr-\[10px\]{
  padding-right: 10px;
}
.pr-\[12px\]{
  padding-right: 12px;
}
.pr-\[175px\]{
  padding-right: 175px;
}
.pr-\[36px\]{
  padding-right: 36px;
}
.pr-\[6px\]{
  padding-right: 6px;
}
.pr-\[8px\]{
  padding-right: 8px;
}
.pt-\[16px\]{
  padding-top: 16px;
}
.pt-\[22px\]{
  padding-top: 22px;
}
.pt-\[24px\]{
  padding-top: 24px;
}
.pt-\[2px\]{
  padding-top: 2px;
}
.pt-\[64px\]{
  padding-top: 64px;
}
.pt-\[88px\]{
  padding-top: 88px;
}
.pt-\[8px\]{
  padding-top: 8px;
}
.pb-\[10px\]{
  padding-bottom: 10px;
}
.pt-\[6px\]{
  padding-top: 6px;
}
.text-left{
  text-align: left;
}
.text-center{
  text-align: center;
}
.text-right{
  text-align: right;
}
.align-middle{
  vertical-align: middle;
}
.font-lato{
  font-family: var(--font-lato), Lato, sans-serif;
}
.font-marcellus{
  font-family: var(--font-marcellus), Marcellus, serif;
}
.font-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.text-\[0px\]{
  font-size: 0px;
}
.text-\[11\.5px\]{
  font-size: 11.5px;
}
.text-\[11px\]{
  font-size: 11px;
}
.text-\[120px\]{
  font-size: 120px;
}
.text-\[12px\]{
  font-size: 12px;
}
.text-\[13\.5px\]{
  font-size: 13.5px;
}
.text-\[13px\]{
  font-size: 13px;
}
.text-\[14px\]{
  font-size: 14px;
}
.text-\[15px\]{
  font-size: 15px;
}
.text-\[16px\]{
  font-size: 16px;
}
.text-\[17px\]{
  font-size: 17px;
}
.text-\[18px\]{
  font-size: 18px;
}
.text-\[20px\]{
  font-size: 20px;
}
.text-\[22px\]{
  font-size: 22px;
}
.text-\[24px\]{
  font-size: 24px;
}
.text-\[26px\]{
  font-size: 26px;
}
.text-\[28px\]{
  font-size: 28px;
}
.text-\[30px\]{
  font-size: 30px;
}
.text-\[32px\]{
  font-size: 32px;
}
.text-\[34px\]{
  font-size: 34px;
}
.text-\[36px\]{
  font-size: 36px;
}
.text-\[40px\]{
  font-size: 40px;
}
.text-\[44px\]{
  font-size: 44px;
}
.text-\[46px\]{
  font-size: 46px;
}
.text-\[64px\]{
  font-size: 64px;
}
.text-\[72px\]{
  font-size: 72px;
}
.text-\[90px\]{
  font-size: 90px;
}
.font-bold{
  font-weight: 700;
}
.font-semibold{
  font-weight: 600;
}
.uppercase{
  text-transform: uppercase;
}
.capitalize{
  text-transform: capitalize;
}
.normal-case{
  text-transform: none;
}
.italic{
  font-style: italic;
}
.not-italic{
  font-style: normal;
}
.leading-\[0\]{
  line-height: 0;
}
.leading-\[1\.6\]{
  line-height: 1.6;
}
.leading-\[106px\]{
  line-height: 106px;
}
.leading-\[15px\]{
  line-height: 15px;
}
.leading-\[18px\]{
  line-height: 18px;
}
.leading-\[19px\]{
  line-height: 19px;
}
.leading-\[20px\]{
  line-height: 20px;
}
.leading-\[21px\]{
  line-height: 21px;
}
.leading-\[22px\]{
  line-height: 22px;
}
.leading-\[23px\]{
  line-height: 23px;
}
.leading-\[24px\]{
  line-height: 24px;
}
.leading-\[26px\]{
  line-height: 26px;
}
.leading-\[28px\]{
  line-height: 28px;
}
.leading-\[29px\]{
  line-height: 29px;
}
.leading-\[30px\]{
  line-height: 30px;
}
.leading-\[31px\]{
  line-height: 31px;
}
.leading-\[32px\]{
  line-height: 32px;
}
.leading-\[34px\]{
  line-height: 34px;
}
.leading-\[36px\]{
  line-height: 36px;
}
.leading-\[40px\]{
  line-height: 40px;
}
.leading-\[42px\]{
  line-height: 42px;
}
.leading-\[44px\]{
  line-height: 44px;
}
.leading-\[48px\]{
  line-height: 48px;
}
.leading-\[50px\]{
  line-height: 50px;
}
.leading-\[54px\]{
  line-height: 54px;
}
.leading-\[56px\]{
  line-height: 56px;
}
.leading-\[60px\]{
  line-height: 60px;
}
.leading-\[78px\]{
  line-height: 78px;
}
.leading-\[normal\]{
  line-height: normal;
}
.leading-none{
  line-height: 1;
}
.leading-tight{
  line-height: 1.25;
}
.tracking-\[0\.04em\]{
  letter-spacing: 0.04em;
}
.tracking-\[0\.05em\]{
  letter-spacing: 0.05em;
}
.tracking-\[0\.08em\]{
  letter-spacing: 0.08em;
}
.tracking-\[0\.12em\]{
  letter-spacing: 0.12em;
}
.tracking-\[0\.16em\]{
  letter-spacing: 0.16em;
}
.tracking-\[0\.18em\]{
  letter-spacing: 0.18em;
}
.tracking-\[0\.1em\]{
  letter-spacing: 0.1em;
}
.text-\[\#0A3C1E\]{
  --tw-text-opacity: 1;
  color: rgb(10 60 30 / var(--tw-text-opacity));
}
.text-\[\#0A3C1E\]\/40{
  color: rgb(10 60 30 / 0.4);
}
.text-\[\#1c1c1c\]{
  --tw-text-opacity: 1;
  color: rgb(28 28 28 / var(--tw-text-opacity));
}
.text-\[\#1c1c1c\]\/55{
  color: rgb(28 28 28 / 0.55);
}
.text-\[\#1c1c1c\]\/60{
  color: rgb(28 28 28 / 0.6);
}
.text-\[\#2F7338\]{
  --tw-text-opacity: 1;
  color: rgb(47 115 56 / var(--tw-text-opacity));
}
.text-\[\#3C8C46\]{
  --tw-text-opacity: 1;
  color: rgb(60 140 70 / var(--tw-text-opacity));
}
.text-\[\#3C8C46\]\/10{
  color: rgb(60 140 70 / 0.1);
}
.text-\[\#3a4a3d\]{
  --tw-text-opacity: 1;
  color: rgb(58 74 61 / var(--tw-text-opacity));
}
.text-\[\#3a4a3d\]\/85{
  color: rgb(58 74 61 / 0.85);
}
.text-\[\#4d4d4d\]{
  --tw-text-opacity: 1;
  color: rgb(77 77 77 / var(--tw-text-opacity));
}
.text-\[\#5AA967\]{
  --tw-text-opacity: 1;
  color: rgb(90 169 103 / var(--tw-text-opacity));
}
.text-\[\#7d7d7d\]{
  --tw-text-opacity: 1;
  color: rgb(125 125 125 / var(--tw-text-opacity));
}
.text-\[\#dde7dd\]{
  --tw-text-opacity: 1;
  color: rgb(221 231 221 / var(--tw-text-opacity));
}
.text-\[\#f1f0f0\]{
  --tw-text-opacity: 1;
  color: rgb(241 240 240 / var(--tw-text-opacity));
}
.text-\[color\:var\(--color\2c white\)\]{
  color: var(--color,white);
}
.text-\[color\:var\(--light-grey\2c \#7d7d7d\)\]{
  color: var(--light-grey,#7d7d7d);
}
.text-white{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-white\/40{
  color: rgb(255 255 255 / 0.4);
}
.text-white\/65{
  color: rgb(255 255 255 / 0.65);
}
.text-white\/70{
  color: rgb(255 255 255 / 0.7);
}
.text-white\/72{
  color: rgb(255 255 255 / 0.72);
}
.text-white\/75{
  color: rgb(255 255 255 / 0.75);
}
.text-white\/80{
  color: rgb(255 255 255 / 0.8);
}
.text-white\/85{
  color: rgb(255 255 255 / 0.85);
}
.underline{
  text-decoration-line: underline;
}
.decoration-solid{
  text-decoration-style: solid;
}
.underline-offset-4{
  text-underline-offset: 4px;
}
.opacity-0{
  opacity: 0;
}
.opacity-10{
  opacity: 0.1;
}
.opacity-100{
  opacity: 1;
}
.opacity-2{
  opacity: 0.02;
}
.opacity-30{
  opacity: 0.3;
}
.opacity-4{
  opacity: 0.04;
}
.opacity-60{
  opacity: 0.6;
}
.opacity-70{
  opacity: 0.7;
}
.opacity-80{
  opacity: 0.8;
}
.opacity-85{
  opacity: 0.85;
}
.opacity-90{
  opacity: 0.9;
}
.opacity-95{
  opacity: 0.95;
}
.shadow-2xl{
  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_-20px_50px_-20px_rgba\(7\2c 38\2c 26\2c 0\.35\)\]{
  --tw-shadow: 0 -20px 50px -20px rgba(7,38,26,0.35);
  --tw-shadow-colored: 0 -20px 50px -20px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_-30px_70px_-20px_rgba\(7\2c 38\2c 26\2c 0\.45\)\]{
  --tw-shadow: 0 -30px 70px -20px rgba(7,38,26,0.45);
  --tw-shadow-colored: 0 -30px 70px -20px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_16px_44px_-16px_rgba\(7\2c 38\2c 26\2c 0\.18\)\]{
  --tw-shadow: 0 16px 44px -16px rgba(7,38,26,0.18);
  --tw-shadow-colored: 0 16px 44px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_16px_44px_-16px_rgba\(7\2c 38\2c 26\2c 0\.22\)\]{
  --tw-shadow: 0 16px 44px -16px rgba(7,38,26,0.22);
  --tw-shadow-colored: 0 16px 44px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_18px_44px_-16px_rgba\(0\2c 0\2c 0\2c 0\.6\)\]{
  --tw-shadow: 0 18px 44px -16px rgba(0,0,0,0.6);
  --tw-shadow-colored: 0 18px 44px -16px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_22px_56px_rgba\(7\2c 38\2c 26\2c 0\.18\)\]{
  --tw-shadow: 0 22px 56px rgba(7,38,26,0.18);
  --tw-shadow-colored: 0 22px 56px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_30px_80px_-30px_rgba\(0\2c 0\2c 0\2c 0\.7\)\]{
  --tw-shadow: 0 30px 80px -30px rgba(0,0,0,0.7);
  --tw-shadow-colored: 0 30px 80px -30px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[var\(--shadow-card\)\]{
  --tw-shadow-color: var(--shadow-card);
  --tw-shadow: var(--tw-shadow-colored);
}
.outline-none{
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.ring-1{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-2{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-\[\#3C8C46\]{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(60 140 70 / var(--tw-ring-opacity));
}
.ring-black\/10{
  --tw-ring-color: rgb(0 0 0 / 0.1);
}
.ring-transparent{
  --tw-ring-color: transparent;
}
.blur{
  --tw-blur: blur(8px);
  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);
}
.drop-shadow{
  --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
  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);
}
.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.backdrop-blur-sm{
  --tw-backdrop-blur: blur(4px);
  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-\[max-height\2c opacity\]{
  transition-property: max-height,opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-all{
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity{
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform{
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-300{
  transition-duration: 300ms;
}
.duration-700{
  transition-duration: 700ms;
}
.duration-\[380ms\]{
  transition-duration: 380ms;
}
.ease-out{
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.col-1 { grid-column-start: 1; }
.col-2 { grid-column-start: 2; }
.row-1 { grid-row-start: 1; }
.row-2 { grid-row-start: 2; }
.row-3 { grid-row-start: 3; }
.row-4 { grid-row-start: 4; }
.\[scrollbar-width\:none\]{
  scrollbar-width: none;
}
.\[text-shadow\:0_1px_12px_rgba\(0\2c 0\2c 0\2c 0\.5\)\]{
  text-shadow: 0 1px 12px rgba(0,0,0,0.5);
}

:root {
  /* Brand greens — eyedropped from EB logo */
  --brand-green:        #3C8C46;
  --brand-green-hover:  #2F7338;
  --brand-green-press:  #245C2C;
  --brand-green-soft:   #5AA967;
  --brand-green-tint:   #DDE7DD;
  --brand-green-mint:   #EEF5EE;

  /* Forest — outer ring + wordmark */
  --forest:             #0A3C1E;
  --forest-90:          #15482A;
  --forest-80:          #1F5538;
  --forest-60:          #4F7560;

  /* Neutrals */
  --ink:                #1C1C1C;
  --ink-2:              #4D4D4D;
  --ink-3:              #7D7D7D;
  --rule:               #E6E6E6;
  --paper:              #F1F0F0;
  --paper-warm:         #F6F4EB;
  --surface:            #FFFFFF;

  /* Radii + shadows */
  --r-pill:   999px;
  --r-card:   40px;
  --r-tile:   16px;
  --r-chip:   30px;
  --r-input:  12px;
  --r-shelf:  100px;

  --shadow-card:   0 12px 32px rgba(10, 60, 30, 0.08);
  --shadow-hover:  0 18px 48px rgba(10, 60, 30, 0.14);
  --shadow-popup:  0 24px 64px rgba(0, 0, 0, 0.18);
}

html, body {
  margin: 0;
  padding: 0;
  background: #F5F5EF;
  overflow-x: hidden;
}

/* Instagram-stories progress fill (hero stories card) */
@keyframes storyFill { from { width: 0%; } to { width: 100%; } }

/* Reviews showcase — vertical "video" poster: slow ken-burns + fade-in on slide change */
@keyframes kenburns { from { transform: scale(1.04); } to { transform: scale(1.14); } }
@keyframes posterFade { from { opacity: 0; } to { opacity: 1; } }
.poster-anim { animation: posterFade 0.5s ease both, kenburns 7s ease-out both; }
@media (prefers-reduced-motion: reduce) {
  .poster-anim { animation: posterFade 0.3s ease both; }
}

/* ============================================================
   Design-system premium backgrounds (updated 2026-05-25)
   Source: ettore-bianconi-design-system/preview/colors-brand.html
   Apply as utility classes on any section/card background.
   ============================================================ */
:root {
  --forest-700: #1F5538;
}
.bg-forest-700 { background-color: var(--forest-700); }

/* forest · soft glow — premium dark green with a top-left light bloom */
.bg-forest-soft {
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(90, 169, 103, 0.35), transparent 55%),
    linear-gradient(160deg, #0F3A22 0%, #1F5538 60%, #0A3C1E 100%);
}
/* forest · deep — darkest surface, subtle bottom-right glow */
.bg-forest-deep {
  background:
    radial-gradient(100% 60% at 100% 100%, rgba(60, 140, 70, 0.28), transparent 60%),
    linear-gradient(180deg, #07261A 0%, #0A3C1E 100%);
}
/* forest · noise — dark green with overlaid grain texture */
.bg-forest-noise {
  background:
    url('/ds/texture-bg.png') center / 360px repeat,
    linear-gradient(180deg, #0A3C1E, #133E26);
  background-blend-mode: overlay, normal;
}
/* cream · mist — warm light surface with a soft center bloom */
/* Warm paper-glow (DS surface) — soft warm light over a #F5F5EF paper base. */
.bg-cream-mist {
  background:
    radial-gradient(115% 75% at 50% -8%, rgba(255, 255, 255, 0.9), transparent 55%),
    radial-gradient(120% 95% at 100% 102%, rgba(221, 212, 184, 0.22), transparent 60%),
    #F5F5EF;
}

/* ============================================================
   Micro-interactions + animated highlight (DS, 2026-05-25)
   Source: preview/components-micro-interactions.html
         + preview/type-animated-highlight.html
   ============================================================ */

/* — Animated highlight: <span class="glow-h"> with <strong> inside.
     The strong word gets the forest soft-glow gradient clipped to glyphs
     plus a sheen that sweeps across. Use .on-dark ancestor on dark bg. */
.glow-h strong {
  font-weight: inherit;
  font-style: inherit;
  position: relative;
  display: inline-block;
  color: transparent;
  background-image:
    linear-gradient(100deg, transparent 0%, transparent 38%, rgba(255,255,255,0.85) 50%, transparent 62%, transparent 100%),
    linear-gradient(100deg, #5AA967 0%, #2F7338 25%, #1F5538 60%, #0A3C1E 100%);
  background-size: 250% 100%, 100% 100%;
  background-position: 150% 0, 0 0;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  animation: glow-sheen 4.2s ease-in-out 0.4s infinite;
}
.on-dark .glow-h strong {
  background-image:
    linear-gradient(100deg, transparent 0%, transparent 38%, rgba(255,255,255,0.95) 50%, transparent 62%, transparent 100%),
    linear-gradient(100deg, #B3DFB9 0%, #5AA967 35%, #5AA967 65%, #B3DFB9 100%);
}
@keyframes glow-sheen {
  0% { background-position: 150% 0, 0 0; }
  55% { background-position: -150% 0, 0 0; }
  100% { background-position: -150% 0, 0 0; }
}

/* — CTA pill: idle sheen sweep + hover boost + arrow rotate.
     Add `cta-sheen` to the pill and `cta-arrow` to the icon wrapper. */
.cta-sheen { position: relative; overflow: hidden; }
.cta-sheen::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,0.30) 50%, transparent 65%);
  background-size: 250% 100%; background-repeat: no-repeat; background-position: 200% 0;
  animation: cta-sheen-idle 3.8s ease-in-out 1s infinite;
}
.cta-sheen:hover::before { animation: cta-sheen-sweep 0.9s ease-out; }
@keyframes cta-sheen-idle { 0%, 100% { background-position: 200% 0; } 55% { background-position: -120% 0; } }
@keyframes cta-sheen-sweep { from { background-position: 200% 0; } to { background-position: -120% 0; } }
.cta-sheen .cta-arrow svg { transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); }
.cta-sheen:hover .cta-arrow svg { transform: rotate(-30deg); }

/* — Eyebrow: the line draws in once, the dot pops then pulses. */
.eb-line {
  position: relative; height: 1.5px; background: currentColor; width: 0;
  animation: eb-draw 0.55s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s forwards;
}
.eb-line::after {
  content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%);
  width: 11px; height: 11px; border-radius: 50%; background: currentColor; opacity: 0;
  animation: eb-pop 0.35s ease-out 0.6s forwards, eb-pulse 2.6s ease-in-out 1.1s infinite;
}
@keyframes eb-draw { to { width: 70px; } }
@keyframes eb-pop { 0% { opacity: 0; transform: translateY(-50%) scale(0.2); } 100% { opacity: 1; transform: translateY(-50%) scale(1); } }
@keyframes eb-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(60,140,70,0.45); } 50% { box-shadow: 0 0 0 8px rgba(60,140,70,0); } }

/* Eyebrow label: fades in only once the line has finished drawing (line done ≈ 1.3s). */
@keyframes eb-fade { to { opacity: 1; } }
.eb-lab { opacity: 0; animation: eb-fade 0.45s ease-out 0.55s forwards; animation-play-state: paused; }
.eb-line.in-view ~ .eb-lab { animation-play-state: running; }

/* — Nav link: underline draws left→right on hover; stays full when active. */
.nav-underline { position: relative; }
.nav-underline::after {
  content: ""; position: absolute; left: 0; bottom: -4px; height: 1.5px; width: 0;
  background: #3C8C46; transition: width 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.nav-underline:hover::after { width: 100%; }
.nav-underline.is-active { color: #3C8C46; }
.nav-underline.is-active::after { width: 100%; }

/* — Hero headline: word-by-word rise on entry (DS type-hero-headline). */
.hw-rise .w {
  display: inline-block;
  opacity: 0;
  transform: translateY(16px);
  animation: w-rise 0.55s cubic-bezier(0.2, 0.8, 0.2, 1) both;
  animation-play-state: paused;
}
.hw-rise.in-view .w { animation-play-state: running; }
.hw-rise .w:nth-child(1) { animation-delay: 0.05s; }
.hw-rise .w:nth-child(2) { animation-delay: 0.09s; }
.hw-rise .w:nth-child(3) { animation-delay: 0.13s; }
.hw-rise .w:nth-child(4) { animation-delay: 0.17s; }
.hw-rise .w:nth-child(5) { animation-delay: 0.21s; }
.hw-rise .w:nth-child(6) { animation-delay: 0.25s; }
.hw-rise .w:nth-child(7) { animation-delay: 0.29s; }
.hw-rise .w:nth-child(8) { animation-delay: 0.33s; }
@keyframes w-rise { to { opacity: 1; transform: none; } }

/* — Pain-map hotspots: pulsing ring to signal they're clickable. */
@keyframes pm-pulse {
  0% { box-shadow: 0 0 0 0 var(--pc, rgba(255,255,255,0.55)); }
  70% { box-shadow: 0 0 0 12px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}
.pm-pulse { animation: pm-pulse 2s ease-out infinite; }
@media (prefers-reduced-motion: reduce) { .pm-pulse { animation: none; } }

/* — Scroll hint chevron: gentle bounce inviting scroll. */
@keyframes chev-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(8px); } }
.scroll-chevron { animation: chev-bounce 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .scroll-chevron { animation: none; } }

/* — 3.1 Hero pin: staccato (torna nel flusso) una volta coperto dal cream. */
.hero-detach { position: absolute !important; }

/* — MissionTabs: fade delle 4 card al cambio tab. Solo opacity: NON deve toccare
   `transform` perché la griglia usa -translate-x-1/2 per centrarsi. */
@keyframes mtFade { from { opacity: 0; } to { opacity: 1; } }
.mt-anim { animation: mtFade 0.4s ease both; }

/* — 2.1 Sticky header: smart-hide + "tuck" alla prima sparizione. */
.nav-pill {
  transform-origin: 50% 0%;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
}
.nav-pill.is-hidden { transform: translateY(-160%); opacity: 0; }
.nav-pill.is-tuck { animation: headerTuck 0.85s cubic-bezier(0.55, -0.25, 0.25, 1) both; }
@keyframes headerTuck {
  0%   { transform: translateY(0) scale(1);        filter: blur(0); opacity: 1; }
  20%  { transform: translateY(12px) scale(0.975); filter: blur(0); opacity: 1; }
  100% { transform: translateY(-165%) scale(0.9);  filter: blur(3px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .nav-pill { transition: opacity 0.3s ease; }
  .nav-pill.is-hidden { transform: none; opacity: 0; }
  .nav-pill.is-tuck { animation: none; }
  .glow-h strong, .cta-sheen::before, .eb-line, .eb-line::after { animation: none; }
  .eb-line { width: 70px; }
  .eb-line::after { opacity: 1; }
  .eb-lab { opacity: 1; animation: none; }
  .hw-rise .w { opacity: 1; transform: none; animation: none; }
  .img-settle { transform: none; animation: none; }
}

/* ---- Scroll-triggered entrance: keep paused until <ScrollReveal/> adds .in-view ---- */
.hero-anim { animation-play-state: paused; }
.hero-anim.in-view { animation-play-state: running; }
.eb-line, .eb-line::after { animation-play-state: paused; }
.eb-line.in-view, .eb-line.in-view::after { animation-play-state: running; }
.glow-h strong { animation-play-state: paused; }
.glow-h.in-view strong { animation-play-state: running; }

body {
  font-family: var(--font-lato), 'Lato', sans-serif;
  color: var(--ink);
  min-width: 0;
}

/* Physeo frame wrapper — width fixed at 1920px, height set per-page via inline style.
   Desktop scaling is handled by <ViewportScaler/> setting CSS `zoom` on <html>. */
.physeo-frame {
  width: 1920px;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
}

/* ---- Premium card hover (1.2): subtle lift + scale on any .hover-card ---- */
.hover-card {
  transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.2, 1),
              box-shadow 0.45s cubic-bezier(0.2, 0.7, 0.2, 1);
  will-change: transform;
}
.hover-card:hover {
  transform: scale(1.025);
  box-shadow: var(--shadow-hover);
}

/* ---- Hero entrance animation (3.4): fade + rise, staggered ---- */
@keyframes heroRise {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero-anim {
  opacity: 0;
  animation: heroRise 0.85s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
}
.hero-anim-1 { animation-delay: 0.05s; }
.hero-anim-2 { animation-delay: 0.18s; }
.hero-anim-3 { animation-delay: 0.31s; }
.hero-anim-4 { animation-delay: 0.44s; }
/* later-entering supporting elements — come in around / after the headline word-rise */
.hero-anim-5 { animation-delay: 0.95s; }
.hero-anim-6 { animation-delay: 1.10s; }

/* Hero media: gentler + slower entrance (lighter rise), and the images themselves
   settle with a minimal zoom-out so they don't pop in aggressively. */
@keyframes heroRiseSoft { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.hero-soft { animation-name: heroRiseSoft; animation-duration: 1.45s; }
@keyframes imgSettle { from { transform: scale(1.06); } to { transform: scale(1); } }
.img-settle { transform: scale(1.06); animation: imgSettle 1.8s cubic-bezier(0.2, 0.7, 0.2, 1) 0.35s both; animation-play-state: paused; }
.hero-anim.in-view .img-settle { animation-play-state: running; }

/* hover-card sits on top of the entrance transform: once revealed, the hover
   transform takes over cleanly (animation leaves transform at translateY(0)). */
@media (prefers-reduced-motion: reduce) {
  .hero-anim { opacity: 1; animation: none; }
  .hover-card { transition: none; }
  .hover-card:hover { transform: none; }
}

/* Smooth focus ring on nav links / buttons */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--brand-green);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Figma export uses `col-1`/`row-1` shorthand which is NOT a Tailwind 3 utility.
   Default Tailwind only ships `col-start-1`, `row-start-1` etc, so without these
   the classes are dropped and grid children flow into separate cells instead of
   overlapping in the same cell — breaking every CTA button with stacked icon+bg. */

/* Mobile: neutralizza lo zoom del ViewportScaler (l'!important da stylesheet
   batte l'inline-style senza-important del JS → corretto anche pre-idratazione). */
@media (max-width: 1023px) {
  html { zoom: 1 !important; }
}
.placeholder\:text-\[\#4d4d4d\]::-moz-placeholder{
  --tw-text-opacity: 1;
  color: rgb(77 77 77 / var(--tw-text-opacity));
}
.placeholder\:text-\[\#4d4d4d\]::placeholder{
  --tw-text-opacity: 1;
  color: rgb(77 77 77 / var(--tw-text-opacity));
}
.placeholder\:text-\[\#7d7d7d\]::-moz-placeholder{
  --tw-text-opacity: 1;
  color: rgb(125 125 125 / var(--tw-text-opacity));
}
.placeholder\:text-\[\#7d7d7d\]::placeholder{
  --tw-text-opacity: 1;
  color: rgb(125 125 125 / var(--tw-text-opacity));
}
.placeholder\:text-white\/55::-moz-placeholder{
  color: rgb(255 255 255 / 0.55);
}
.placeholder\:text-white\/55::placeholder{
  color: rgb(255 255 255 / 0.55);
}
.first\:mt-0:first-child{
  margin-top: 0px;
}
.first\:pt-0:first-child{
  padding-top: 0px;
}
.last\:border-b-0:last-child{
  border-bottom-width: 0px;
}
.hover\:scale-110:hover{
  --tw-scale-x: 1.1;
  --tw-scale-y: 1.1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:border-\[\#3C8C46\]:hover{
  --tw-border-opacity: 1;
  border-color: rgb(60 140 70 / var(--tw-border-opacity));
}
.hover\:border-\[\#3C8C46\]\/30:hover{
  border-color: rgb(60 140 70 / 0.3);
}
.hover\:border-\[\#3C8C46\]\/40:hover{
  border-color: rgb(60 140 70 / 0.4);
}
.hover\:border-\[\#5AA967\]:hover{
  --tw-border-opacity: 1;
  border-color: rgb(90 169 103 / var(--tw-border-opacity));
}
.hover\:border-white\/25:hover{
  border-color: rgb(255 255 255 / 0.25);
}
.hover\:bg-\[\#2F7338\]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(47 115 56 / var(--tw-bg-opacity));
}
.hover\:bg-\[\#3C8C46\]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(60 140 70 / var(--tw-bg-opacity));
}
.hover\:bg-\[\#C9DCC9\]:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(201 220 201 / var(--tw-bg-opacity));
}
.hover\:bg-black\/10:hover{
  background-color: rgb(0 0 0 / 0.1);
}
.hover\:bg-black\/45:hover{
  background-color: rgb(0 0 0 / 0.45);
}
.hover\:bg-black\/5:hover{
  background-color: rgb(0 0 0 / 0.05);
}
.hover\:bg-white:hover{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.hover\:bg-white\/10:hover{
  background-color: rgb(255 255 255 / 0.1);
}
.hover\:bg-white\/20:hover{
  background-color: rgb(255 255 255 / 0.2);
}
.hover\:text-\[\#1c1c1c\]:hover{
  --tw-text-opacity: 1;
  color: rgb(28 28 28 / var(--tw-text-opacity));
}
.hover\:text-\[\#3C8C46\]:hover{
  --tw-text-opacity: 1;
  color: rgb(60 140 70 / var(--tw-text-opacity));
}
.hover\:text-white:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:text-white\/85:hover{
  color: rgb(255 255 255 / 0.85);
}
.hover\:opacity-100:hover{
  opacity: 1;
}
.hover\:opacity-70:hover{
  opacity: 0.7;
}
.hover\:opacity-80:hover{
  opacity: 0.8;
}
.hover\:opacity-90:hover{
  opacity: 0.9;
}
.hover\:shadow-\[0_12px_32px_rgba\(10\2c 60\2c 30\2c 0\.08\)\]:hover{
  --tw-shadow: 0 12px 32px rgba(10,60,30,0.08);
  --tw-shadow-colored: 0 12px 32px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.focus\:border-\[\#3C8C46\]:focus{
  --tw-border-opacity: 1;
  border-color: rgb(60 140 70 / var(--tw-border-opacity));
}
.focus\:opacity-100:focus{
  opacity: 1;
}
.focus\:ring-2:focus{
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-\[\#3C8C46\]:focus{
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(60 140 70 / var(--tw-ring-opacity));
}
.disabled\:opacity-70:disabled{
  opacity: 0.7;
}
.group[open] .group-open\:rotate-45{
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:-rotate-\[30deg\]{
  --tw-rotate: -30deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:bg-\[\#3C8C46\]{
  --tw-bg-opacity: 1;
  background-color: rgb(60 140 70 / var(--tw-bg-opacity));
}
.group:hover .group-hover\:bg-white\/10{
  background-color: rgb(255 255 255 / 0.1);
}
.group:hover .group-hover\:text-\[\#3C8C46\]{
  --tw-text-opacity: 1;
  color: rgb(60 140 70 / var(--tw-text-opacity));
}
@media (min-width: 640px){

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

  .md\:block{
    display: block;
  }

  .md\:grid-cols-2{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .lg\:mt-\[56px\]{
    margin-top: 56px;
  }

  .lg\:mt-\[64px\]{
    margin-top: 64px;
  }

  .lg\:block{
    display: block;
  }

  .lg\:hidden{
    display: none;
  }

  .lg\:aspect-auto{
    aspect-ratio: auto;
  }

  .lg\:h-\[583px\]{
    height: 583px;
  }

  .lg\:w-\[1630px\]{
    width: 1630px;
  }

  .lg\:w-\[460px\]{
    width: 460px;
  }

  .lg\:shrink-0{
    flex-shrink: 0;
  }

  .lg\:grid-cols-\[1\.3fr_1fr_1fr_1fr_1\.3fr\]{
    grid-template-columns: 1.3fr 1fr 1fr 1fr 1.3fr;
  }

  .lg\:flex-row{
    flex-direction: row;
  }

  .lg\:items-center{
    align-items: center;
  }

  .lg\:justify-between{
    justify-content: space-between;
  }

  .lg\:gap-\[56px\]{
    gap: 56px;
  }

  .lg\:rounded-\[40px\]{
    border-radius: 40px;
  }

  .lg\:p-\[40px\]{
    padding: 40px;
  }

  .lg\:px-0{
    padding-left: 0px;
    padding-right: 0px;
  }

  .lg\:pt-\[160px\]{
    padding-top: 160px;
  }

  .lg\:pt-\[200px\]{
    padding-top: 200px;
  }

  .lg\:pt-\[96px\]{
    padding-top: 96px;
  }

  .lg\:text-\[52px\]{
    font-size: 52px;
  }

  .lg\:leading-\[60px\]{
    line-height: 60px;
  }

  .lg\:leading-\[62px\]{
    line-height: 62px;
  }
}
.\[\&\:\:-webkit-scrollbar\]\:hidden::-webkit-scrollbar{
  display: none;
}
.\[\&\:\:placeholder\]\:capitalize::-moz-placeholder{
  text-transform: capitalize;
}
.\[\&\:\:placeholder\]\:capitalize::placeholder{
  text-transform: capitalize;
}
.\[\&\:\:placeholder\]\:text-\[\#4d4d4d\]::-moz-placeholder{
  --tw-text-opacity: 1;
  color: rgb(77 77 77 / var(--tw-text-opacity));
}
.\[\&\:\:placeholder\]\:text-\[\#4d4d4d\]::placeholder{
  --tw-text-opacity: 1;
  color: rgb(77 77 77 / var(--tw-text-opacity));
}
.\[\&\:\:placeholder\]\:text-\[\#f1f0f0\]::-moz-placeholder{
  --tw-text-opacity: 1;
  color: rgb(241 240 240 / var(--tw-text-opacity));
}
.\[\&\:\:placeholder\]\:text-\[\#f1f0f0\]::placeholder{
  --tw-text-opacity: 1;
  color: rgb(241 240 240 / var(--tw-text-opacity));
}
.\[\&\:\:placeholder\]\:opacity-60::-moz-placeholder{
  opacity: 0.6;
}
.\[\&\:\:placeholder\]\:opacity-60::placeholder{
  opacity: 0.6;
}
.\[\&\>\*\]\:pointer-events-auto>*{
  pointer-events: auto;
}
.\[\&\>svg\]\:size-\[22px\]>svg{
  width: 22px;
  height: 22px;
}
.\[\&_\.eb-lab\]\:text-\[10px\] .eb-lab{
  font-size: 10px;
}
.\[\&_\.eb-lab\]\:tracking-\[0\.16em\] .eb-lab{
  letter-spacing: 0.16em;
}
.\[\&_a\]\:pointer-events-auto a{
  pointer-events: auto;
}
.\[\&_button\]\:pointer-events-auto button{
  pointer-events: auto;
}