/* =========================
   ODYSSEY PRICING – CLEAN
   ========================= */

/* base */
.od-wrapper, .od-wrapper * { box-sizing: border-box; }
.od-wrapper { font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial; }

/* ===== ODYSSEY: FULLSCREEN + RESET TEMA ===== */
html.odyssey-active,
body.odyssey-active{
  height: 100% !important;
  background: #000 !important;
}

/* azzera contenitori tema (spazi bianchi) */
body.odyssey-active #page,
body.odyssey-active #content,
body.odyssey-active #primary,
body.odyssey-active #main{
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* nasconde titolo pagina del tema */
body.odyssey-active .entry-header,
body.odyssey-active .entry-title,
body.odyssey-active h1.entry-title,
body.odyssey-active .page-header,
body.odyssey-active h1.page-title{
  display: none !important;
}

/* wrapper fullscreen con griglia */
body.odyssey-active .odyssey-page{
  position: fixed;
  inset: 0;
  z-index: 9999;
  overflow: hidden;

  background:
    linear-gradient(rgba(180,180,180,0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(180,180,180,0.12) 1px, transparent 1px),
    #000;
  background-size: 72px 72px;
}

/* particelle fullscreen sotto al frame */
body.odyssey-active #od-particles-bg{
  position: fixed;
  inset: 0;
  z-index: 1;
  opacity: 0.26;
}

/* wrapper contenuto (non gestisce background) */
body.odyssey-active .od-wrapper{
  position: relative;
  width: 100%;
  height: 100%;
  background: transparent !important;
}

/* ===== FRAME CENTRATO 90% ===== */
body.odyssey-active .od-frame{
  position: absolute;

  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 90%;
  max-width: 1600px;
  height: 88vh;

  border-radius: 36px;

  /* BACKGROUND PIÙ SOLIDO */
  background: rgba(8, 12, 16, 0.985);

  /* glow SOLO esterno, più controllato */
  box-shadow: 0 0 40px rgba(0,0,0,0.6);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  padding: 48px;
  overflow: auto;

  z-index: 2;
}

/* scrollbars eleganti */
body.odyssey-active .od-frame{
  scrollbar-width: thin;
  scrollbar-color: rgba(124,255,203,0.35) rgba(0,0,0,0.35);
}
body.odyssey-active .od-frame::-webkit-scrollbar{ width: 10px; }
body.odyssey-active .od-frame::-webkit-scrollbar-track{
  background: rgba(0,0,0,0.35);
  border-radius: 10px;
}
body.odyssey-active .od-frame::-webkit-scrollbar-thumb{
  background: rgba(124,255,203,0.35);
  border-radius: 10px;
  border: 2px solid rgba(0,0,0,0.25);
}
body.odyssey-active .od-frame::-webkit-scrollbar-thumb:hover{
  background: rgba(124,255,203,0.55);
}

/* ===== HEADER ===== */
.od-head{ text-align:center; margin-bottom: 26px; }
.od-kicker{
  letter-spacing: .22em;
  font-size: 12px;
  color: rgba(124,255,203,0.88);
}
.od-title{
  margin: 10px 0 6px;
  font-size: 44px;
  line-height: 1.05;
  color: #fff;
}
.od-subtitle{
  margin: 0;
  font-size: 16px;
  color: rgba(255,255,255,0.78);
}

/* ===== GRID CARDS ===== */
.od-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 26px;
}

/* ===== CARD ===== */
.od-card{
  border-radius: 28px;
  overflow: hidden;
  background: rgba(3, 7, 12, 0.62);
  border: 1px solid rgba(148,163,184,0.18);
  box-shadow: 0 0 0 1px rgba(44,255,155,0.06) inset;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.od-card:hover{
  transform: translateY(-4px);
  border-color: rgba(124,255,203,0.55);
  box-shadow:
    0 0 32px rgba(44,255,155,0.20),
    0 0 0 1px rgba(44,255,155,0.12) inset;
}

.od-card.is-recommended{
  border-color: rgba(44,255,155,0.65);
  box-shadow:
    0 0 60px rgba(44,255,155,0.26),
    inset 0 0 40px rgba(44,255,155,0.18);
}

.od-card-top{
  padding: 22px 20px 18px;
  border-bottom: 1px solid rgba(148,163,184,0.14);
}

.od-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  color: rgba(0,0,0,0.90);
  background: linear-gradient(90deg, #2cff9b, #7CFFCB);
  box-shadow: 0 0 18px rgba(44,255,155,0.32);
}

.od-plan{
  margin: 12px 0 6px;
  font-size: 20px;
  color: #fff;
}

.od-tagline{
  margin: 0 0 14px;
  font-size: 13px;
  color: rgba(255,255,255,0.74);
}

/* price */
.od-price{
  display:flex;
  align-items: baseline;
  justify-content:center;
  gap: 8px;
  margin: 10px 0 14px;
}
.od-price-value{
  font-size: 36px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.02em;
}
.od-price-period{
  font-size: 13px;
  color: rgba(255,255,255,0.68);
}

/* Annual save text near price */
.od-price-save{
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: rgba(124,255,203,0.85);
}

/* CTA */
.od-cta{
  width: 100%;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(124,255,203,0.35);
  background: rgba(2,6,23,0.65);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.od-cta:hover{
  border-color: rgba(44,255,155,0.75);
  box-shadow: 0 0 22px rgba(44,255,155,0.22);
  transform: translateY(-1px);
}
.od-cta:focus{
  outline: none;
  box-shadow: 0 0 0 2px rgba(44,255,155,0.25), 0 0 18px rgba(44,255,155,0.20);
}

/* features */
.od-features{
  list-style: none;
  margin: 0;
  padding: 16px 20px 20px;
}
.od-features li{
  position: relative;
  padding-left: 22px;
  margin: 10px 0;
  font-size: 13px;
  color: rgba(255,255,255,0.76);
}
.od-features li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #2cff9b;
  text-shadow: 0 0 10px rgba(44,255,155,0.45);
}

/* responsive */
@media (max-width: 980px){
  body.odyssey-active .od-frame{
    width: 95%;
    height: 92vh;
    padding: 22px;
    border-radius: 24px;
  }
  .od-grid{ grid-template-columns: 1fr; }
  .od-title{ font-size: 34px; }
}

/* ===== Billing toggle ===== */
.od-billing{
  margin-top: 16px;
  display: inline-flex;
  gap: 10px;
  padding: 8px;
  border-radius: 999px;
  background: rgba(0,0,0,0.25);
  border: 1px solid rgba(148,163,184,0.16);
}

.od-billing-btn{
  border: 1px solid rgba(148,163,184,0.18);
  background: rgba(2,6,23,0.45);
  color: rgba(255,255,255,0.82);
  padding: 10px 14px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 700;
  font-size: 13px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.od-billing-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(44,255,155,0.55);
  box-shadow: 0 0 16px rgba(44,255,155,0.14);
}
.od-billing-btn.is-active{
  color: rgba(0,0,0,0.92);
  background: linear-gradient(90deg, #2cff9b, #7CFFCB);
  border-color: rgba(44,255,155,0.25);
  box-shadow: 0 0 18px rgba(44,255,155,0.22);
}

.od-save-pill{
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  color: rgba(0,0,0,0.9);
  background: linear-gradient(90deg, #2cff9b, #7CFFCB);
}

/* ===== ENTERPRISE + PROBE ROW ===== */
.od-enterprise-row{
  margin-top: 34px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: stretch; /* importante: stessa altezza */
}

/* card condivisa (ENTERPRISE/PROBE) */
.od-enterprise-card{
  border-radius: 28px;
  overflow: hidden;
  background: rgba(3, 7, 12, 0.62);
  border: 1px solid rgba(148,163,184,0.18);
  box-shadow: 0 0 0 1px rgba(44,255,155,0.06) inset;

  /* CHIAVE per allineare i pulsanti */
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Probe card leggermente diversa */
.od-probe-card{
  background: rgba(6, 10, 14, 0.82);
}

/* contenuto probe */
.od-probe-content{
  padding: 18px 20px 22px;
  color: rgba(255,255,255,0.82);
  font-size: 14px;
  line-height: 1.55;
}
.od-probe-content p{ margin: 0 0 14px; }
.od-probe-note{
  color: rgba(124,255,203,0.9);
  font-weight: 600;
}

/* CTA PROBE: sempre in basso e allineata con Enterprise */
.od-probe-actions{
  margin-top: auto;          /* spinge in fondo */
  padding: 0 20px 20px;      /* stessa aria delle altre sezioni */
}

/* responsive */
@media (max-width: 980px){
  .od-enterprise-row{
    grid-template-columns: 1fr;
  }
}

/* ===== ENTERPRISE / PROBE CTA ALLINEATE ===== */

/* area azioni in fondo */
.od-enterprise-actions,
.od-probe-actions{
  margin-top: auto;          /* SPINGE IN BASSO */
  padding: 0 20px 20px;
}

/* assicura che la lista non rompa il layout */
.od-enterprise-card .od-features{
  margin-bottom: 0;
}

/* sicurezza: il top non cresce */
.od-enterprise-card .od-card-top{
  flex-shrink: 0;
}

/* ===== Struttura comune Enterprise/Probe ===== */
.od-enterprise-card{
  display:flex;
  flex-direction:column;
  height:100%;
}

/* body comune: prende tutto lo spazio */
.od-enterprise-card .od-card-body{
  padding: 0;            /* il padding lo gestiscono i figli */
  flex: 1 1 auto;        /* riempie lo spazio */
  display:block;
}

/* === Enterprise/Probe: stessa anatomia, CTA allineate === */
.od-enterprise-card{
  display:flex;
  flex-direction:column;
  height:100%;
}

/* body prende lo spazio disponibile */
.od-enterprise-card .od-card-body{
  flex: 1 1 auto;
}

/* actions sempre in basso, padding identico */
.od-enterprise-card .od-card-actions{
  margin-top: auto;
  padding: 0 20px 20px;
}

/* separatore sopra ai bottoni (stesso per entrambe) */
.od-enterprise-card .od-card-actions{
  border-top: 1px solid rgba(148,163,184,0.14);
  padding-top: 18px;
}

/* padding coerente del contenuto */
.od-enterprise-card .od-features{
  padding: 18px 20px 22px;
  margin: 0;
}
.od-enterprise-card .od-probe-content{
  padding: 18px 20px 22px;
}

/* =========================
   ODYSSEY – TITOLI NEON
   ========================= */

/* Nomi piani Odyssey */
.od-plan{
  color: #7CFFCB;
  text-shadow:
    0 0 6px rgba(124,255,203,0.45),
    0 0 18px rgba(44,255,155,0.25);
}

/* Titolo prodotto Probe */
.od-probe-card .od-plan{
  color: #7CFFCB;
  text-shadow:
    0 0 6px rgba(124,255,203,0.45),
    0 0 18px rgba(44,255,155,0.25);
}

/* Enterprise incluso */
.od-enterprise-card .od-plan{
  color: #7CFFCB;
  text-shadow:
    0 0 6px rgba(124,255,203,0.45),
    0 0 18px rgba(44,255,155,0.25);
}
.od-card.is-recommended .od-plan{
  color: #2cff9b;
  text-shadow:
    0 0 10px rgba(44,255,155,0.75),
    0 0 28px rgba(44,255,155,0.55);
}

/* =========================
   CTA NEON (Enterprise + Probe)
   ========================= */

/* solo i due bottoni in basso (custom + probe) */
.od-enterprise-row .od-card-actions .od-cta{
  border: 1px solid rgba(124,255,203,0.55) !important;
  background: rgba(6, 10, 14, 0.85) !important;
  color: rgba(255,255,255,0.92) !important;

  box-shadow:
    0 0 18px rgba(124,255,203,0.35),
    inset 0 0 12px rgba(44,255,155,0.25) !important;

  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.od-enterprise-row .od-card-actions .od-cta:hover{
  border-color: #2cff9b !important;
  box-shadow:
    0 0 28px rgba(44,255,155,0.55),
    inset 0 0 18px rgba(44,255,155,0.35) !important;
  transform: translateY(-1px);
}

.od-enterprise-row .od-card-actions .od-cta:focus{
  outline: none !important;
  box-shadow:
    0 0 0 2px rgba(124,255,203,0.28),
    0 0 22px rgba(44,255,155,0.35),
    inset 0 0 16px rgba(44,255,155,0.25) !important;
}

/* =========================
   CTA PIANI – BLU NEON
   (stesso effetto dei CTA sotto)
   ========================= */

/* SOLO i bottoni dentro le card dei piani */
.od-grid .od-card .od-cta{
  border: 1px solid rgba(93,173,255,0.55);
  background: rgba(6, 10, 18, 0.85);
  color: rgba(255,255,255,0.95);

  box-shadow:
    0 0 18px rgba(93,173,255,0.35),
    inset 0 0 12px rgba(93,173,255,0.25);

  transition: transform .2s ease,
              box-shadow .2s ease,
              border-color .2s ease;
}

/* hover */
.od-grid .od-card .od-cta:hover{
  border-color: #5dade2;
  box-shadow:
    0 0 30px rgba(93,173,255,0.55),
    inset 0 0 18px rgba(93,173,255,0.35);
  transform: translateY(-1px);
}

/* focus */
.od-grid .od-card .od-cta:focus{
  outline: none;
  box-shadow:
    0 0 0 2px rgba(93,173,255,0.35),
    0 0 24px rgba(93,173,255,0.45),
    inset 0 0 16px rgba(93,173,255,0.30);
}

/* =========================
   BILLING TOGGLE – NEON BLUE
   ========================= */

.od-billing{
  margin-top: 18px;
  display: inline-flex;
  gap: 10px;
  padding: 8px;
  border-radius: 999px;

  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(93,173,255,0.25);

  box-shadow:
    inset 0 0 12px rgba(93,173,255,0.08);
}

/* pulsante base */
.od-billing-btn{
  border: 1px solid rgba(93,173,255,0.35);
  background: rgba(6, 10, 18, 0.75);
  color: rgba(255,255,255,0.85);

  padding: 10px 16px;
  border-radius: 999px;
  cursor: pointer;

  font-weight: 700;
  font-size: 13px;

  box-shadow:
    0 0 10px rgba(93,173,255,0.15),
    inset 0 0 8px rgba(93,173,255,0.12);

  transition: all .2s ease;
}

/* hover */
.od-billing-btn:hover{
  border-color: rgba(93,173,255,0.75);
  box-shadow:
    0 0 18px rgba(93,173,255,0.35),
    inset 0 0 12px rgba(93,173,255,0.25);
  transform: translateY(-1px);
}

/* stato attivo */
.od-billing-btn.is-active{
  color: #ffffff;

  background: rgba(8, 16, 26, 0.95);
  border-color: #5dade2;

  box-shadow:
    0 0 22px rgba(93,173,255,0.55),
    inset 0 0 18px rgba(93,173,255,0.35);
}

/* pill risparmio */
.od-save-pill{
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;

  font-size: 11px;
  font-weight: 800;

  color: rgba(255,255,255,0.95);
  background: rgba(93,173,255,0.85);

  box-shadow:
    0 0 12px rgba(93,173,255,0.55);
}

/* =========================
   PARTNER PROGRAM – BLUE NEON UNIFY
   ========================= */

/* colore guida = CTA Partner */
.odyssey-page{
  --partner-blue: rgba(93,173,255,1);
  --partner-blue-soft: rgba(93,173,255,0.55);
  --partner-blue-glow: rgba(93,173,255,0.35);
}

/* === TITOLI PIANI === */
.odyssey-page .od-plan{
  color: var(--partner-blue);
  text-shadow:
    0 0 6px var(--partner-blue-soft),
    0 0 18px var(--partner-blue-glow);
}

/* === BADGE === */
.odyssey-page .od-badge{
  background: linear-gradient(90deg, #5dade2, #89c4ff);
  color: #fff;
  box-shadow: 0 0 18px var(--partner-blue-glow);
}

/* === CHECK FEATURE === */
.odyssey-page .od-features li::before{
  color: var(--partner-blue);
  text-shadow: 0 0 10px var(--partner-blue-glow);
}

/* === CARD BORDER & GLOW === */
.odyssey-page .od-grid .od-card{
  border-color: var(--partner-blue-soft);
  box-shadow: 0 0 0 1px var(--partner-blue-glow) inset;
}

.odyssey-page .od-grid .od-card:hover{
  border-color: var(--partner-blue);
  box-shadow:
    0 0 36px var(--partner-blue-glow),
    0 0 0 1px var(--partner-blue-soft) inset;
}

.odyssey-page .od-grid .od-card.is-recommended{
  border-color: var(--partner-blue);
  box-shadow:
    0 0 64px var(--partner-blue-glow),
    inset 0 0 44px var(--partner-blue-glow);
}

/* === CTA PARTNER (rende il blu la fonte unica) === */
.odyssey-page .od-cta{
  border-color: var(--partner-blue);
  box-shadow:
    0 0 18px var(--partner-blue-glow),
    inset 0 0 12px var(--partner-blue-soft);
}

.odyssey-page .od-cta:hover{
  border-color: #89c4ff;
  box-shadow:
    0 0 30px var(--partner-blue-glow),
    inset 0 0 18px var(--partner-blue-soft);
}

.odyssey-page .od-cta:focus{
  outline: none;
  box-shadow:
    0 0 0 2px var(--partner-blue-soft),
    0 0 22px var(--partner-blue-glow),
    inset 0 0 16px var(--partner-blue-soft);
}

/* === ELIMINA QUALSIASI RESIDUO VERDE === */
.odyssey-page [style*="#2cff9b"],
.odyssey-page [style*="#7CFFCB"],
.odyssey-page [style*="44,255,155"]{
  filter: hue-rotate(190deg);
}