/* ==========================================================================
   Halftonix – Blog (archivio + articolo singolo)
   Token copiati dal Kit Elementor (post-5.css): stessi nomi --hx-*, così in
   WordPress basta rimuovere il blocco :root e usare le variabili globali del sito.
   ========================================================================== */

:root {
  --hx-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --hx-black: #000; --hx-white: #fff; --hx-ink: #1d1d1f; --hx-parchment: #f5f5f7;
  --hx-tile: #0a0a0c; --hx-tile-2: #111114;
  --hx-text-on-dark: #e8e8ed; --hx-text-soft: #3a3a3c;
  --hx-muted: #86868b; --hx-muted-dark: #a1a1a6; --hx-muted-light: #6e6e73;
  --hx-accent: #ff4cff; --hx-accent-light: #ff7aff; --hx-accent-soft: #ffb3ff; --hx-accent-dark: #e03ae0;
  --hx-accent-deep: #c026d3; --hx-accent-glow: #ff4cff73; --hx-accent-aura: #ff4cff47;
  --hx-accent-tint: #ff4cff1a; --hx-accent-line: #ff4cff4d; --hx-accent-deep-tint: #c026d314; --hx-accent-deep-line: #c026d34d;
  --hx-violet: #b86bff; --hx-violet-deep: #7c3aed;
  --hx-gold: #f5c842; --hx-gold-light: #ffe89a; --hx-gold-dark: #d99a12; --hx-gold-ink: #2a1a00; --hx-gold-glow: #f5b4288c; --hx-gold-line: #f5c84259; --hx-ok: #30d158; --hx-danger: #ff3b30;
  --hx-hairline-dark: #ffffff1f; --hx-hairline-light: #00000014;
  --hx-glass-lo: #ffffff0d; --hx-glass-hi: #ffffff29; --hx-glass-edge: #ffffff61; --hx-scrim: #1212169e;
  --hx-dots: #ffffff38; --hx-shadow: #0000008c; --hx-shadow-soft: #0000002e;

  --hx-fs-2xs: 12px; --hx-fs-xs: 13px; --hx-fs-small: 14px; --hx-fs-body: 17px; --hx-fs-h4: 21px;
  --hx-fs-lead: clamp(19px, 1.9vw, 24px); --hx-fs-card: clamp(21px, 1.9vw, 26px);
  --hx-fs-h3: clamp(24px, 2.6vw, 32px); --hx-fs-h2: clamp(32px, 4.6vw, 56px);
  --hx-fs-h1: clamp(36px, 5.6vw, 72px); --hx-fs-display: clamp(40px, 7.2vw, 88px);
  --hx-lh-body: 1.47; --hx-lh-lead: 1.42; --hx-lh-heading: 1.1; --hx-lh-display: 1.04; --hx-lh-snug: 1.2;
  --hx-ls-body: -0.022em; --hx-ls-heading: -0.035em; --hx-ls-display: -0.045em; --hx-ls-label: 0.1em; --hx-ls-tight: -0.02em;

  --hx-sp-2xs: 4px; --hx-sp-xs: 8px; --hx-sp-sm: 12px; --hx-sp-md: 16px; --hx-sp-lg: 20px; --hx-sp-xl: 24px;
  --hx-sp-2xl: 32px; --hx-sp-3xl: 40px; --hx-sp-4xl: 56px; --hx-sp-5xl: 72px; --hx-sp-6xl: 96px;
  --hx-sp-gutter: clamp(16px, 4vw, 40px); --hx-sp-card: clamp(28px, 4vw, 56px);
  --hx-sp-section: clamp(80px, 11vw, 150px);
  --hx-r-xs: 7px; --hx-r-sm: 12px; --hx-r-md: 18px; --hx-r-lg: 28px; --hx-r-xl: 40px; --hx-r-pill: 999px;
  --hx-nav-h: 60px; --hx-btn-h: 48px; --hx-btn-h-lg: 58px; --hx-dot-grid: 22px;
  --hx-w-wide: 1200px; --hx-w-text: 720px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--hx-black); color: var(--hx-ink); overflow-x: clip;
  font-family: var(--hx-font); font-size: var(--hx-fs-body); line-height: var(--hx-lh-body); letter-spacing: var(--hx-ls-body);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
.hx-wrap { width: 100%; max-width: var(--hx-w-wide); margin-inline: auto; padding-inline: var(--hx-sp-gutter); }
.hx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Testo in gradiente (come <em> della landing) ---------- */
.hx-grad { font-style: normal; background: linear-gradient(80deg, var(--hx-white) 0%, var(--hx-accent) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hx-light .hx-grad { background-image: linear-gradient(80deg, var(--hx-ink) 0%, var(--hx-accent-deep) 100%); }

/* ---------- Eyebrow con pallino ---------- */
.hx-eyebrow { display: inline-flex; align-items: center; gap: var(--hx-sp-xs); font-size: var(--hx-fs-small); font-weight: 600; color: var(--hx-accent); }
.hx-eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px var(--hx-accent-glow); }
.hx-light .hx-eyebrow { color: var(--hx-accent-deep); }

/* ---------- Bottoni ---------- */
.hx-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--hx-sp-xs);
  min-height: var(--hx-btn-h); padding: 0 var(--hx-sp-xl); border-radius: var(--hx-r-pill); border: 0;
  font: 600 var(--hx-fs-body)/1 var(--hx-font); letter-spacing: var(--hx-ls-tight); text-decoration: none; cursor: pointer;
  transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, background-color .25s;
}
.hx-btn--cta { color: var(--hx-black); background: linear-gradient(180deg, var(--hx-accent-light) 0%, var(--hx-accent) 45%, var(--hx-accent-dark) 100%); box-shadow: 0 8px 28px var(--hx-accent-aura), inset 0 1px 0 #ffffff80; }
.hx-btn--cta:hover { transform: translateY(-2px); box-shadow: 0 14px 40px var(--hx-accent-glow), inset 0 1px 0 #ffffff80; }
.hx-btn--ghost { color: var(--hx-white); background: var(--hx-glass-lo); box-shadow: inset 0 0 0 1px var(--hx-hairline-dark); }
.hx-btn--ghost:hover { background: var(--hx-glass-hi); }
.hx-btn--lg { min-height: var(--hx-btn-h-lg); padding: 0 var(--hx-sp-2xl); font-size: 19px; }
.hx-btn--block { width: 100%; }
.hx-btn svg { width: 20px; height: 20px; flex: none; }

/* ---------- Nav ---------- */
.hx-nav { position: sticky; top: 0; z-index: 50; height: var(--hx-nav-h); background: #000000b8; backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid var(--hx-hairline-dark); }
.hx-nav .hx-wrap { height: 100%; display: flex; align-items: center; gap: var(--hx-sp-xl); }
.hx-nav__logo { flex: none; display: flex; }
.hx-nav__logo img { height: 22px; width: auto; max-width: none; flex: none; }
.hx-nav__links { display: flex; gap: var(--hx-sp-xl); margin-left: auto; list-style: none; padding: 0; margin-block: 0; }
.hx-nav__links a { color: var(--hx-muted-dark); font-size: var(--hx-fs-small); text-decoration: none; transition: color .2s; }
.hx-nav__links a:hover, .hx-nav__links a[aria-current] { color: var(--hx-white); }
.hx-nav .hx-btn { min-height: 34px; padding: 0 var(--hx-sp-md); font-size: var(--hx-fs-small); }
@media (max-width: 860px) {
  /* su mobile resta solo logo + selettore lingua */
  .hx-nav .hx-wrap { gap: var(--hx-sp-md); }
  .hx-nav__links { display: none; }
}

/* ---------- Hero scuro con aura + retino ---------- */
.hx-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--hx-black); color: var(--hx-white); padding: clamp(72px, 10vw, 130px) 0 clamp(56px, 7vw, 96px); }
.hx-hero::before { /* aura */
  content: ""; position: absolute; z-index: -2; left: 50%; top: -30%; width: min(1100px, 140vw); aspect-ratio: 1.6; translate: -50% 0;
  background: radial-gradient(closest-side, var(--hx-accent-aura), #7c3aed2e 55%, transparent 100%); filter: blur(24px);
  animation: hx-aura 14s ease-in-out infinite alternate;
}
.hx-hero::after { /* retino */
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; pointer-events: none;
  background-image: radial-gradient(var(--hx-dots) 1px, transparent 2px); background-size: var(--hx-dot-grid) var(--hx-dot-grid);
  -webkit-mask: radial-gradient(60% 55% at 50% 30%, #000, transparent 75%); mask: radial-gradient(60% 55% at 50% 30%, #000, transparent 75%);
}
@keyframes hx-aura { to { transform: translate3d(0, 4%, 0) scale(1.08) rotate(3deg); } }
@media (prefers-reduced-motion: reduce) { .hx-hero::before { animation: none; } html { scroll-behavior: auto; } }

.hx-hero__title { font-size: var(--hx-fs-h1); line-height: var(--hx-lh-display); letter-spacing: var(--hx-ls-display); font-weight: 700; margin: var(--hx-sp-lg) 0 var(--hx-sp-lg); text-wrap: balance; }
.hx-hero__lead { font-size: var(--hx-fs-lead); line-height: var(--hx-lh-lead); color: var(--hx-muted-dark); margin: 0; max-width: 680px; text-wrap: pretty; }
.hx-hero--center { text-align: center; }
.hx-hero--center .hx-hero__lead { margin-inline: auto; }

/* Filtri categoria (pill) */
.hx-chips { display: flex; flex-wrap: wrap; gap: var(--hx-sp-xs); justify-content: center; margin-top: var(--hx-sp-3xl); }
.hx-chip { appearance: none; border: 0; cursor: pointer; font: 500 var(--hx-fs-small)/1 var(--hx-font); padding: 10px var(--hx-sp-md); border-radius: var(--hx-r-pill); color: var(--hx-text-on-dark); background: var(--hx-glass-lo); box-shadow: inset 0 0 0 1px var(--hx-hairline-dark); transition: background .2s, color .2s; }
.hx-chip:hover { background: var(--hx-glass-hi); }
.hx-chip[aria-pressed="true"] { background: var(--hx-accent); color: var(--hx-black); box-shadow: 0 6px 20px var(--hx-accent-aura); }

/* ---------- Card articolo in evidenza ---------- */
.hx-featured { display: grid; grid-template-columns: 1.25fr 1fr; gap: 0; margin-top: var(--hx-sp-4xl); border-radius: var(--hx-r-lg); overflow: hidden; text-decoration: none; background: linear-gradient(180deg, var(--hx-tile-2), var(--hx-tile)); box-shadow: inset 0 0 0 1px var(--hx-hairline-dark), 0 40px 80px var(--hx-shadow); transition: transform .4s cubic-bezier(.22,1,.36,1); }
.hx-featured:hover { transform: translateY(-4px); }
.hx-featured__media { aspect-ratio: 16/10; overflow: hidden; }
.hx-featured__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22,1,.36,1); }
.hx-featured:hover .hx-featured__media img { transform: scale(1.04); }
.hx-featured__body { padding: var(--hx-sp-card); display: flex; flex-direction: column; justify-content: center; gap: var(--hx-sp-md); text-align: left; }
.hx-featured__title { font-size: var(--hx-fs-h3); line-height: var(--hx-lh-heading); letter-spacing: var(--hx-ls-heading); margin: 0; color: var(--hx-white); text-wrap: balance; }
.hx-featured__excerpt { margin: 0; color: var(--hx-muted-dark); }
@media (max-width: 860px) { .hx-featured { grid-template-columns: 1fr; } }

/* ---------- Meta / tag ---------- */
.hx-tag { display: inline-block; align-self: flex-start; padding: 5px 10px; border-radius: var(--hx-r-pill); font-size: var(--hx-fs-2xs); font-weight: 600; letter-spacing: .02em; color: var(--hx-accent); background: var(--hx-accent-tint); box-shadow: inset 0 0 0 1px var(--hx-accent-line); }
.hx-light .hx-tag { color: var(--hx-accent-deep); background: var(--hx-accent-deep-tint); box-shadow: inset 0 0 0 1px var(--hx-accent-deep-line); }
.hx-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--hx-sp-xs) var(--hx-sp-md); font-size: var(--hx-fs-xs); color: var(--hx-muted); }
.hx-meta span + span::before { content: "·"; margin-right: var(--hx-sp-md); }
.hx-more { margin-top: auto; font-size: var(--hx-fs-small); font-weight: 600; color: var(--hx-accent); }
.hx-light .hx-more { color: var(--hx-accent-deep); }

/* ---------- Sezioni chiare ---------- */
.hx-light { background: var(--hx-parchment); color: var(--hx-ink); }
.hx-white { background: var(--hx-white); color: var(--hx-ink); }
.hx-section { padding: var(--hx-sp-section) 0; }
.hx-section__head { display: flex; align-items: end; justify-content: space-between; gap: var(--hx-sp-xl); margin-bottom: var(--hx-sp-3xl); flex-wrap: wrap; }
.hx-h2 { font-size: var(--hx-fs-h2); line-height: var(--hx-lh-heading); letter-spacing: var(--hx-ls-heading); font-weight: 700; margin: var(--hx-sp-sm) 0 0; text-wrap: balance; }

/* ---------- Griglia card ---------- */
.hx-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--hx-sp-xl); }
@media (max-width: 1000px) { .hx-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .hx-grid { grid-template-columns: 1fr; } }
.hx-card { display: flex; flex-direction: column; background: var(--hx-white); border-radius: var(--hx-r-lg); overflow: hidden; text-decoration: none; color: var(--hx-ink); box-shadow: 0 1px 0 var(--hx-hairline-light), 0 18px 40px -24px var(--hx-shadow-soft); transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s; }
.hx-card:hover { transform: translateY(-6px); box-shadow: 0 1px 0 var(--hx-hairline-light), 0 30px 60px -28px #0000004d; }
.hx-card__media { aspect-ratio: 16/10; overflow: hidden; background: var(--hx-black); }
.hx-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22,1,.36,1); }
.hx-card:hover .hx-card__media img { transform: scale(1.05); }
.hx-card__body { flex: 1; display: flex; flex-direction: column; gap: var(--hx-sp-sm); padding: var(--hx-sp-xl) var(--hx-sp-xl) var(--hx-sp-2xl); }
.hx-card__title { font-size: var(--hx-fs-h4); line-height: var(--hx-lh-snug); letter-spacing: var(--hx-ls-tight); font-weight: 700; margin: 0; text-wrap: balance; }
.hx-card__excerpt { margin: 0; font-size: 15px; color: var(--hx-muted-light); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hx-card[hidden] { display: none; }
.hx-empty { grid-column: 1/-1; text-align: center; color: var(--hx-muted-light); padding: var(--hx-sp-3xl) 0; }

/* ---------- Offerta (CTA d'acquisto, come .hx-offer della landing) ---------- */
.hx-offer-sec { position: relative; isolation: isolate; overflow: hidden; background: var(--hx-black); color: var(--hx-white); padding: var(--hx-sp-section) 0; text-align: center; }
.hx-offer-sec::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 55%; width: min(1000px, 140vw); aspect-ratio: 1.4; translate: -50% -50%; background: radial-gradient(closest-side, var(--hx-accent-aura), transparent); filter: blur(30px); }
.hx-offer-sec .hx-hero__lead { margin-inline: auto; }
.hx-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 420px)); justify-content: center; gap: var(--hx-sp-xl); margin-top: var(--hx-sp-4xl); text-align: center; }
@media (max-width: 860px) { .hx-plans { grid-template-columns: minmax(0, 420px); } }
.hx-plan { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--hx-sp-sm); padding: var(--hx-sp-card) var(--hx-sp-2xl); border-radius: var(--hx-r-xl); background: #fffffff0; color: var(--hx-ink); box-shadow: 0 40px 80px var(--hx-shadow); }
.hx-plan--dark { background: linear-gradient(180deg, #1a0f1c, var(--hx-tile)); color: var(--hx-white); box-shadow: inset 0 0 0 1px var(--hx-accent-line), 0 40px 80px var(--hx-shadow); }
.hx-plan__badge { padding: 4px 12px; border-radius: var(--hx-r-pill); background: var(--hx-accent); color: var(--hx-black); font-size: var(--hx-fs-2xs); font-weight: 700; letter-spacing: var(--hx-ls-tight); }
.hx-plan__name { font-size: var(--hx-fs-h4); font-weight: 700; margin: var(--hx-sp-xs) 0 0; letter-spacing: var(--hx-ls-tight); }
.hx-price { display: flex; align-items: flex-start; justify-content: center; gap: var(--hx-sp-sm); font-weight: 700; line-height: 1; letter-spacing: -0.06em; }
.hx-price__amount { font-size: clamp(72px, 9vw, 104px); background: linear-gradient(180deg, var(--hx-accent-light), var(--hx-accent-deep)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hx-price__amount sup { font-size: .36em; vertical-align: top; position: relative; top: 12px; margin-left: 2px; color: var(--hx-accent-deep); -webkit-text-fill-color: var(--hx-accent-deep); }
.hx-price__old { font-size: var(--hx-fs-h4); font-weight: 500; color: var(--hx-muted); text-decoration: line-through; text-decoration-color: var(--hx-accent); margin-top: 18px; letter-spacing: 0; }
.hx-plan__forever { font-weight: 600; color: var(--hx-accent-deep); margin: 0; }
.hx-plan--dark .hx-plan__forever { color: var(--hx-accent); }
.hx-plan__list { list-style: none; padding: 0; margin: var(--hx-sp-sm) 0 var(--hx-sp-lg); display: grid; gap: var(--hx-sp-xs); font-size: 15px; text-align: left; }
.hx-plan__list li { display: flex; gap: var(--hx-sp-xs); }
.hx-plan__list li::before { content: "✓"; color: var(--hx-accent-deep); font-weight: 700; }
.hx-plan--dark .hx-plan__list li::before { color: var(--hx-accent); }
.hx-plan .hx-btn { margin-top: auto; }
.hx-plan__note { font-size: var(--hx-fs-xs); color: var(--hx-muted); margin: 0; }

/* ---------- Articolo: intestazione ---------- */
.hx-crumbs { display: flex; flex-wrap: wrap; gap: var(--hx-sp-xs); list-style: none; padding: 0; margin: 0 0 var(--hx-sp-2xl); font-size: var(--hx-fs-xs); color: var(--hx-muted); }
.hx-crumbs li + li::before { content: "/"; margin-right: var(--hx-sp-xs); opacity: .5; }
.hx-crumbs a { text-decoration: none; color: var(--hx-muted-dark); }
.hx-crumbs a:hover { color: var(--hx-white); }
.hx-post-head { max-width: 900px; }
.hx-post-head .hx-hero__title { font-size: clamp(34px, 4.8vw, 60px); }
.hx-post-head .hx-meta { margin-top: var(--hx-sp-xl); color: var(--hx-muted-dark); }
.hx-author { display: inline-flex; align-items: center; gap: var(--hx-sp-xs); }
.hx-author i { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 700; color: var(--hx-black); background: linear-gradient(135deg, var(--hx-accent-light), var(--hx-violet)); }
.hx-cover { margin: var(--hx-sp-4xl) 0 0; border-radius: var(--hx-r-lg); overflow: hidden; box-shadow: inset 0 0 0 1px var(--hx-hairline-dark), 0 40px 80px var(--hx-shadow); aspect-ratio: 16/9; background: var(--hx-tile); }
.hx-cover img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Articolo: corpo + sidebar ---------- */
.hx-post { background: var(--hx-white); padding: var(--hx-sp-5xl) 0 var(--hx-sp-section); }
.hx-post__grid { display: grid; grid-template-columns: minmax(0, var(--hx-w-text)) 300px; justify-content: space-between; gap: var(--hx-sp-5xl); }
@media (max-width: 1060px) { .hx-post__grid { grid-template-columns: minmax(0, 1fr); justify-content: center; } .hx-aside { display: none; } .hx-prose { margin-inline: auto; width: 100%; min-width: 0; } }
.hx-prose { font-size: 18px; line-height: 1.62; color: var(--hx-text-soft); max-width: var(--hx-w-text); }
.hx-prose > * + * { margin-top: 1.1em; }
.hx-prose p, .hx-prose ul, .hx-prose ol { margin-bottom: 0; }
.hx-prose h2 { font-size: clamp(26px, 3vw, 36px); line-height: var(--hx-lh-heading); letter-spacing: var(--hx-ls-heading); color: var(--hx-ink); margin: 2.2em 0 0; scroll-margin-top: calc(var(--hx-nav-h) + 24px); text-wrap: balance; }
.hx-prose h3 { font-size: var(--hx-fs-h4); line-height: var(--hx-lh-snug); letter-spacing: var(--hx-ls-tight); color: var(--hx-ink); margin: 1.8em 0 0; scroll-margin-top: calc(var(--hx-nav-h) + 24px); }
.hx-prose strong { color: var(--hx-ink); }
.hx-prose a { color: var(--hx-accent-deep); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.hx-prose a:hover { text-decoration-thickness: 2px; }
.hx-prose ul, .hx-prose ol { padding-left: 1.3em; }
.hx-prose li + li { margin-top: .45em; }
.hx-prose li::marker { color: var(--hx-accent-deep); font-weight: 700; }
.hx-prose .hx-lead-p { font-size: var(--hx-fs-lead); line-height: var(--hx-lh-lead); color: var(--hx-ink); letter-spacing: var(--hx-ls-tight); }
.hx-prose blockquote { margin-inline: 0; padding: var(--hx-sp-lg) var(--hx-sp-xl); border-left: 3px solid var(--hx-accent); background: var(--hx-parchment); border-radius: 0 var(--hx-r-md) var(--hx-r-md) 0; color: var(--hx-ink); font-weight: 500; }
.hx-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.hx-prose table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 15px; }
.hx-prose th, .hx-prose td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--hx-hairline-light); vertical-align: top; }
.hx-prose thead th { font-size: var(--hx-fs-xs); text-transform: uppercase; letter-spacing: var(--hx-ls-label); color: var(--hx-muted-light); border-bottom-color: var(--hx-ink); }
.hx-prose tbody tr:nth-child(odd) { background: #f5f5f780; }

/* Box "in breve" (featured snippet) */
.hx-tldr { padding: var(--hx-sp-xl) var(--hx-sp-2xl); border-radius: var(--hx-r-lg); background: var(--hx-parchment); box-shadow: inset 0 0 0 1px var(--hx-hairline-light); }
.hx-tldr > b { display: block; font-size: var(--hx-fs-xs); text-transform: uppercase; letter-spacing: var(--hx-ls-label); color: var(--hx-accent-deep); margin-bottom: var(--hx-sp-xs); }
.hx-tldr ul { margin: 0; }

/* Callout suggerimento / attenzione */
.hx-note { display: grid; grid-template-columns: auto 1fr; gap: var(--hx-sp-md); padding: var(--hx-sp-lg) var(--hx-sp-xl); border-radius: var(--hx-r-md); background: var(--hx-accent-deep-tint); box-shadow: inset 0 0 0 1px var(--hx-accent-deep-line); color: var(--hx-ink); font-size: 16px; }
.hx-note::before { content: "i"; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-style: italic; font-family: Georgia, serif; color: var(--hx-white); background: var(--hx-accent-deep); }
.hx-note--warn { background: #ff3b300f; box-shadow: inset 0 0 0 1px #ff3b3033; }
.hx-note--warn::before { content: "!"; font-style: normal; font-family: var(--hx-font); background: var(--hx-danger); }

/* Checklist */
.hx-check { list-style: none; padding: 0 !important; display: grid; gap: var(--hx-sp-sm); }
.hx-check li { display: grid; grid-template-columns: 26px 1fr; gap: var(--hx-sp-sm); margin: 0 !important; }
.hx-check li::before { content: "✓"; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; color: var(--hx-black); background: linear-gradient(180deg, var(--hx-accent-light), var(--hx-accent)); }

/* CTA dentro l'articolo */
.hx-inline-cta { position: relative; isolation: isolate; overflow: hidden; margin: 2.4em 0 !important; padding: var(--hx-sp-2xl); border-radius: var(--hx-r-lg); background: var(--hx-black); color: var(--hx-text-on-dark); display: grid; grid-template-columns: 1fr auto; gap: var(--hx-sp-xl); align-items: center; }
.hx-inline-cta::before { content: ""; position: absolute; z-index: -1; right: -20%; top: -60%; width: 70%; aspect-ratio: 1; background: radial-gradient(closest-side, var(--hx-accent-aura), transparent); }
.hx-inline-cta::after { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .35; background-image: radial-gradient(var(--hx-dots) 1px, transparent 2px); background-size: 18px 18px; -webkit-mask: linear-gradient(90deg, transparent 40%, #000); mask: linear-gradient(90deg, transparent 40%, #000); }
.hx-inline-cta b { display: block; font-size: var(--hx-fs-h4); line-height: var(--hx-lh-snug); color: var(--hx-white); letter-spacing: var(--hx-ls-tight); margin-bottom: 6px; }
.hx-inline-cta p { margin: 0; font-size: 15px; color: var(--hx-muted-dark); }
.hx-inline-cta .hx-btn { text-decoration: none; color: var(--hx-black); white-space: nowrap; }
@media (max-width: 640px) { .hx-inline-cta { grid-template-columns: 1fr; } }

/* Figura */
.hx-prose figure { margin: 2em 0 0; }
.hx-prose figure img { border-radius: var(--hx-r-md); width: 100%; }
.hx-prose figcaption { margin-top: var(--hx-sp-xs); font-size: var(--hx-fs-xs); color: var(--hx-muted); text-align: center; }

/* FAQ */
.hx-faq { margin-top: var(--hx-sp-lg) !important; border-top: 1px solid var(--hx-hairline-light); }
.hx-faq details { border-bottom: 1px solid var(--hx-hairline-light); }
.hx-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: var(--hx-sp-md); padding: var(--hx-sp-lg) 0; font-weight: 600; color: var(--hx-ink); font-size: 18px; letter-spacing: var(--hx-ls-tight); }
.hx-faq summary::-webkit-details-marker { display: none; }
.hx-faq summary::after { content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--hx-parchment); color: var(--hx-accent-deep); font-weight: 400; font-size: 20px; transition: transform .3s; }
.hx-faq details[open] summary::after { transform: rotate(45deg); }
.hx-faq details > div { padding: 0 0 var(--hx-sp-lg); font-size: 16px; }

/* Sidebar */
.hx-aside { position: relative; }
.hx-aside__sticky { position: sticky; top: calc(var(--hx-nav-h) + 24px); display: grid; gap: var(--hx-sp-xl); }
.hx-toc { font-size: var(--hx-fs-small); }
.hx-toc b { display: block; font-size: var(--hx-fs-2xs); text-transform: uppercase; letter-spacing: var(--hx-ls-label); color: var(--hx-muted-light); margin-bottom: var(--hx-sp-sm); }
.hx-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--hx-hairline-light); }
.hx-toc a { display: block; padding: 6px 0 6px var(--hx-sp-md); margin-left: -1px; border-left: 2px solid transparent; color: var(--hx-muted-light); text-decoration: none; line-height: 1.35; transition: color .2s, border-color .2s; }
.hx-toc a:hover { color: var(--hx-ink); }
.hx-toc a.is-active { color: var(--hx-accent-deep); border-left-color: var(--hx-accent-deep); font-weight: 600; }
.hx-mini { position: relative; overflow: hidden; isolation: isolate; padding: var(--hx-sp-xl); border-radius: var(--hx-r-lg); background: var(--hx-black); color: var(--hx-white); text-align: center; }
.hx-mini::before { content: ""; position: absolute; z-index: -1; inset: -40% -40% auto; aspect-ratio: 1; background: radial-gradient(closest-side, var(--hx-accent-aura), transparent); }
.hx-mini img { height: 18px; width: auto; max-width: none; margin: 0 auto var(--hx-sp-md); }
.hx-mini p { margin: 0 0 var(--hx-sp-md); font-size: var(--hx-fs-small); color: var(--hx-muted-dark); line-height: 1.4; }
.hx-mini .hx-price__amount { font-size: 56px; }
.hx-mini .hx-price { margin-bottom: 4px; }
.hx-mini small { display: block; margin: 0 0 var(--hx-sp-md); font-size: var(--hx-fs-xs); color: var(--hx-accent); font-weight: 600; }
.hx-mini .hx-btn { color: var(--hx-black); }

/* Progress di lettura */
.hx-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--hx-accent-light), var(--hx-violet)); }

/* Condivisione */
.hx-share { display: flex; align-items: center; gap: var(--hx-sp-xs); margin-top: var(--hx-sp-3xl) !important; padding-top: var(--hx-sp-xl); border-top: 1px solid var(--hx-hairline-light); font-size: var(--hx-fs-small); color: var(--hx-muted-light); }
.hx-share a, .hx-share button { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; border: 0; cursor: pointer; background: var(--hx-parchment); color: var(--hx-ink); text-decoration: none !important; }
.hx-share a:hover, .hx-share button:hover { background: var(--hx-accent-deep-tint); color: var(--hx-accent-deep); }
.hx-share svg { width: 17px; height: 17px; }

/* ---------- Buybar flottante (come la landing) ---------- */
.hx-buybar { position: fixed; z-index: 40; left: 50%; bottom: 20px; width: min(640px, calc(100% - 24px)); translate: -50% 140%; display: flex; align-items: center; gap: var(--hx-sp-md); padding: 8px 8px 8px var(--hx-sp-xl); border-radius: var(--hx-r-pill); background: #3a3a3cc7; color: var(--hx-white); backdrop-filter: saturate(180%) blur(24px); -webkit-backdrop-filter: saturate(180%) blur(24px); box-shadow: inset 0 0 0 1px var(--hx-glass-hi), 0 20px 50px var(--hx-shadow); transition: translate .6s cubic-bezier(.22,1,.36,1); }
.hx-buybar.is-on { translate: -50% 0; }
.hx-buybar__name { font-weight: 600; font-size: 15px; line-height: 1.2; }
.hx-buybar__name small { display: block; font-weight: 400; font-size: var(--hx-fs-2xs); color: var(--hx-muted-dark); }
.hx-buybar__price { margin-left: auto; font-weight: 700; font-size: 20px; }
.hx-buybar .hx-btn { min-height: 44px; font-size: 15px; }
@media (max-width: 480px) { .hx-buybar__name small { display: none; } }

/* ---------- Footer ---------- */
.hx-footer { background: var(--hx-black); color: var(--hx-muted); padding: var(--hx-sp-5xl) 0; border-top: 1px solid var(--hx-hairline-dark); font-size: var(--hx-fs-small); }
.hx-footer__grid { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: var(--hx-sp-2xl); }
@media (max-width: 760px) { .hx-footer__grid { grid-template-columns: 1fr 1fr; } }
.hx-footer img { height: 26px; width: auto; max-width: none; margin-bottom: var(--hx-sp-md); }
.hx-footer h4 { margin: 0 0 var(--hx-sp-sm); color: var(--hx-white); font-size: var(--hx-fs-small); }
.hx-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--hx-sp-xs); }
.hx-footer a { text-decoration: none; color: var(--hx-muted); }
.hx-footer a:hover { color: var(--hx-white); }
.hx-footer__legal { margin-top: var(--hx-sp-3xl); padding-top: var(--hx-sp-xl); border-top: 1px solid var(--hx-hairline-dark); font-size: var(--hx-fs-xs); }

/* ---------- Reveal ---------- */
.hx-reveal { opacity: 0; transform: translateY(32px); filter: blur(10px); transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1), filter .9s; }
.hx-reveal.is-in { opacity: 1; transform: none; filter: none; }
@media (prefers-reduced-motion: reduce) { .hx-reveal { opacity: 1; transform: none; filter: none; transition: none; } }

/* ---------- Offerta bundle 97€: palette oro (come .hx-btn--gold / .hx-badge-gold della landing) ---------- */
.hx-btn--gold { color: var(--hx-gold-ink); background: linear-gradient(180deg, var(--hx-gold-light) 0%, var(--hx-gold) 45%, var(--hx-gold-dark) 100%); box-shadow: inset 0 1px 0 #ffffff61, 0 12px 32px -8px var(--hx-gold-glow); }
.hx-btn--gold:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 #ffffff61, 0 18px 44px -8px var(--hx-gold-glow); }
.hx-plan--gold { background: linear-gradient(180deg, #1c1608, var(--hx-tile)); box-shadow: inset 0 0 0 1px var(--hx-gold-line), 0 40px 80px var(--hx-shadow), 0 0 60px -20px var(--hx-gold-glow); }
.hx-plan--gold .hx-plan__badge { color: var(--hx-gold-ink); background: linear-gradient(180deg, var(--hx-gold-light), var(--hx-gold) 45%, var(--hx-gold-dark)); }
.hx-plan--gold .hx-price__amount { background-image: linear-gradient(180deg, var(--hx-gold-light), var(--hx-gold) 50%, var(--hx-gold-dark)); }
.hx-plan--gold .hx-price__amount sup { color: var(--hx-gold); -webkit-text-fill-color: var(--hx-gold); }
.hx-plan--gold .hx-price__old { text-decoration-color: var(--hx-gold); }
.hx-plan--gold .hx-plan__forever { color: var(--hx-gold-light); }
.hx-plan--gold .hx-plan__list li::before { color: var(--hx-gold); }
.hx-inline-cta--gold::before { background: radial-gradient(closest-side, var(--hx-gold-glow), transparent); opacity: .6; }
.hx-mini--gold::before { background: radial-gradient(closest-side, var(--hx-gold-glow), transparent); opacity: .7; }
.hx-mini--gold .hx-price__amount { background-image: linear-gradient(180deg, var(--hx-gold-light), var(--hx-gold) 50%, var(--hx-gold-dark)); }
.hx-mini--gold .hx-price__amount sup { color: var(--hx-gold); -webkit-text-fill-color: var(--hx-gold); }
.hx-mini--gold small { color: var(--hx-gold); }
.hx-mini--gold .hx-btn { color: var(--hx-gold-ink); }

/* ---------- Selettore lingua nella nav ---------- */
.hx-lang { display: flex; gap: 2px; margin-left: var(--hx-sp-md); padding: 3px; border-radius: var(--hx-r-pill); background: var(--hx-glass-lo); box-shadow: inset 0 0 0 1px var(--hx-hairline-dark); }
.hx-lang a { padding: 5px 9px; border-radius: var(--hx-r-pill); font-size: var(--hx-fs-2xs); font-weight: 600; letter-spacing: .04em; color: var(--hx-muted-dark); text-decoration: none; transition: background .2s, color .2s; }
.hx-lang a:hover { color: var(--hx-white); }
.hx-lang a[aria-current] { color: var(--hx-black); background: var(--hx-white); }
@media (max-width: 860px) { .hx-lang { margin-left: auto; flex: none; } }

/* ---------- Banner consenso cookie (solo GA4) ---------- */
.hx-cc { position: fixed; z-index: 70; left: 50%; bottom: 16px; translate: -50% 0; width: min(760px, calc(100% - 24px));
  display: flex; align-items: center; gap: var(--hx-sp-lg); padding: var(--hx-sp-md) var(--hx-sp-lg);
  border-radius: var(--hx-r-lg); background: #1c1c1ef2; color: var(--hx-text-on-dark);
  backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);
  box-shadow: inset 0 0 0 1px var(--hx-hairline-dark), 0 24px 60px var(--hx-shadow);
  animation: hx-cc-in .5s cubic-bezier(.22,1,.36,1) both; }
.hx-cc[hidden] { display: none; }
.hx-cc p { margin: 0; font-size: var(--hx-fs-small); line-height: 1.45; }
.hx-cc a { color: var(--hx-accent); text-decoration: underline; text-underline-offset: 2px; }
.hx-cc__btns { display: flex; gap: var(--hx-sp-xs); margin-left: auto; }
.hx-cc .hx-btn { min-height: 40px; padding: 0 var(--hx-sp-lg); font-size: var(--hx-fs-small); white-space: nowrap; }
@keyframes hx-cc-in { from { opacity: 0; transform: translateY(20px); } }
@media (max-width: 760px) { .hx-cc { flex-direction: column; align-items: stretch; text-align: left; } .hx-cc__btns { margin-left: 0; } .hx-cc .hx-btn { flex: 1; } }