/*
Theme Name: NexMind Child (Zeen)
Template: zeen
Description: Child theme di Zeen per NexMind
Version: 1.0.0
Text Domain: nexmind-child
*/

/* =========================================================
   1. DESIGN TOKENS
   Modifica solo questi valori per cambiare l'intero look.
   ========================================================= */
:root {
  --nx-radius-img: 18px;     /* immagini, card, embed */
  --nx-radius-sm: 10px;      /* input, tag, code */
  --nx-radius-pill: 999px;   /* bottoni e categorie */

  /* Arancione del logo NexMind */
  --nx-accent: #ff6a00;
  --nx-accent-hover: #e65c00;
  --nx-accent-text: #e65c00;  /* arancione per testo piccolo su bianco (piu' leggibile) */
  --nx-on-accent: #ffffff;    /* testo sopra i bottoni/CTA arancioni */
  /* Fondo dei bottoni: arancione piu' scuro, il testo bianco si legge meglio
     (contrasto 4,1:1 contro 2,9:1 di #ff6a00). Stessi valori in Zeen:
     "Carica altro", freccia torna su, bottone contatti. */
  --nx-button: #d45500;
  --nx-button-hover: #bf4d00;
  --nx-text: #1d1d1f;
  --nx-muted: #6e6e73;
  --nx-bg: #ffffff;
  --nx-surface: #f5f5f7;
  --nx-border: rgba(0, 0, 0, .08);

  /* Hero/header: sempre nero, in ogni modalita' e stato (anche sticky).
     Non e' legato a --nx-bg apposta: il resto del sito resta bianco in
     light mode, mentre l'header resta nero anche li'. */
  --nx-header-bg: #000000;
  --nx-header-bg-solid: #000000;
  --nx-header-text: #ffffff;
  --nx-header-muted: rgba(255, 255, 255, .65);
  --nx-header-surface: rgba(255, 255, 255, .1);
  --nx-header-border: rgba(255, 255, 255, .14);

  --nx-shadow: 0 8px 30px rgba(0, 0, 0, .08);
  --nx-shadow-hover: 0 14px 40px rgba(0, 0, 0, .14);
  --nx-ease: cubic-bezier(.2, .8, .2, 1);
  /* Font di sistema: SF Pro su Apple, Segoe UI su Windows, Roboto su Android.
     Stesso stack impostato in Zeen (Tipografia > Font Source: Custom). */
  --nx-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Dark mode: html.nx-dark viene aggiunta da functions.php quando il sistema
   e' in modalita' scura (insieme a body.mode--alt--b, la dark mode di Zeen). */
html.nx-dark {
  --nx-accent: #ff6a00;
  --nx-accent-hover: #ff7f24;
  --nx-accent-text: #ff7a1a;
  --nx-text: #f5f5f7;
  --nx-muted: #a1a1a6;
  --nx-bg: #000000;
  --nx-surface: #1c1c1e;
  --nx-border: rgba(255, 255, 255, .12);
  --nx-shadow: 0 8px 30px rgba(0, 0, 0, .5);
  --nx-shadow-hover: 0 14px 40px rgba(0, 0, 0, .7);

  /* L'header e' gia' nero: in dark mode si confonde con lo sfondo,
     ma i confini restano leggibili grazie al bordo. */
  --nx-header-surface: rgba(255, 255, 255, .14);
  --nx-header-border: rgba(255, 255, 255, .18);
}

/* =========================================================
   2. BASE E TIPOGRAFIA
   ========================================================= */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

/* Sfondo pagina esplicito: solo l'header (sopra) resta nero */
html,
body,
#page.site {
  background-color: var(--nx-bg);
}

body {
  font-family: var(--nx-font);
  color: var(--nx-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Le dimensioni dei titoli le genera Zeen (Tipografia > Dimensioni):
   qui solo peso, spaziatura e interlinea, uguali ovunque. */
h1, h2, h3, h4,
.entry-title, .title {
  letter-spacing: -.02em;
  font-weight: 700;
  line-height: 1.2;
  /* pretty: righe piene, evita solo la parola orfana sull'ultima riga.
     (balance rendeva tutte le righe uguali: su 3 righe il titolo andava
     a capo a meta' colonna). balance resta sui titoli centrati delle card. */
  text-wrap: pretty;
}
.preview-classic .title,
.preview-grid .title,
.preview-mini-wrap .title { line-height: 1.25; }
/* Titolo articolo: interlinea stretta e stacco dal sottotitolo */
.site .hero-meta .title { line-height: 1.15; }
.site .hero-meta .subtitle {
  margin-top: .6em;
  line-height: 1.5;
  letter-spacing: 0;
  color: var(--nx-muted);
  margin-bottom: 18px;
}
/* Icone social sotto il titolo: vicine al sottotitolo (prima 48px di
   vuoto: margine di 28px sotto il sottotitolo + 20px sopra le icone) */
.site .hero-meta [class*="share-it-below"] { padding-top: 0; }
.site .hero-meta .share-it .share-button { margin-bottom: 0; }
/* Senza sottotitolo (guide prodotto, pagine, articoli senza sommario):
   stesso stacco tra titolo e icone */
.site .hero-meta .meta-no-sub { margin-bottom: 18px; }
@media (min-width: 768px) {
  .single .hero-meta { padding-bottom: 26px; }
}
.byline { letter-spacing: .02em; }

::selection { background: var(--nx-accent); color: var(--nx-on-accent); }

a { transition: color .2s var(--nx-ease), opacity .2s var(--nx-ease); }

/* =========================================================
   3. IMMAGINI ARROTONDATE (globale)
   ========================================================= */
img,
video,
iframe,
.wp-block-image img,
.wp-caption img,
.mask,
.mask img,
.media-wrap,
.featured-img,
.post-thumbnail img,
.tipi-image,
.gallery img,
.wp-block-gallery img,
.wp-block-embed iframe,
.wp-video,
figure > img {
  border-radius: var(--nx-radius-img);
}

/* Contenitori che devono "tagliare" l'immagine agli angoli.
   isolation: isolate serve a Safari: le immagini con l'animazione di
   comparsa di Zeen (o lo zoom al passaggio del mouse) finiscono su un
   livello a parte e Safari smette di arrotondare gli angoli in basso. */
.mask,
.media-wrap,
.featured-img,
.post-thumbnail,
.hero-wrap .hero,
figure,
.wp-caption,
.wp-block-image {
  overflow: hidden;
  border-radius: var(--nx-radius-img);
  isolation: isolate;
}

/* Immagine di apertura a tutta larghezza su mobile: bordi dritti,
   gli angoli arrotondati toccherebbero il bordo dello schermo */
@media (max-width: 767px) {
  .hero-wrap .hero,
  .hero-wrap .hero img { border-radius: 0; }
}

/* Eccezioni: loghi, avatar, icone, emoji non vanno arrotondati come le foto */
.custom-logo,
.logo img,
.site-logo img,
img.emoji,
img.avatar,
.tipi-flex img.avatar { border-radius: 0; }

img.avatar,
.author-avatar img,
.byline img { border-radius: 50%; }

/* Didascalie */
figcaption,
.wp-caption-text {
  font-size: .85rem;
  color: var(--nx-muted);
  text-align: center;
  padding-top: .6rem;
}

/* =========================================================
   4. CARD ARTICOLI: hover elegante
   ========================================================= */
.mask img,
.post-thumbnail img,
.featured-img img {
  transition: transform .6s var(--nx-ease), filter .3s var(--nx-ease);
  will-change: transform;
}

article:hover .mask img,
.preview-classic:hover .mask img,
.post-thumbnail:hover img {
  transform: scale(1.04);
}

/* Card con sfondo (se il layout Zeen lo prevede) */
.preview-grid,
.preview-classic,
.preview-mini-wrap,
.tipi-card {
  border-radius: var(--nx-radius-img);
}

/* Ombra morbida solo sulle card che hanno gia' uno sfondo */
.preview-grid .mask,
.tipi-card {
  box-shadow: var(--nx-shadow);
  transition: box-shadow .3s var(--nx-ease), transform .3s var(--nx-ease);
}
.preview-grid:hover .mask,
.tipi-card:hover {
  box-shadow: var(--nx-shadow-hover);
  transform: translateY(-2px);
}

/* Titoli card: max 3 righe */
.preview-classic .title,
.preview-grid .title {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* =========================================================
   5. BOTTONI E CTA (pill, stile Apple)
   ========================================================= */
.tipi-button,
.button,
button[type="submit"],
input[type="submit"],
.wp-block-button__link,
.more-link,
.nx-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4em;
  padding: .75em 1.5em;
  border: 0;
  border-radius: var(--nx-radius-pill);
  background: var(--nx-button);
  color: var(--nx-on-accent) !important;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background .2s var(--nx-ease), transform .2s var(--nx-ease), box-shadow .2s var(--nx-ease);
}

.tipi-button:hover,
.button:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.more-link:hover,
.nx-cta:hover {
  background: var(--nx-button-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--nx-button) 35%, transparent);
}

.tipi-button:active,
.nx-cta:active { transform: scale(.98); }

/* Variante secondaria: aggiungi la classe "nx-ghost" al bottone */
.nx-ghost,
.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--nx-accent) !important;
  box-shadow: inset 0 0 0 1.5px var(--nx-accent);
}
.nx-ghost:hover,
.is-style-outline .wp-block-button__link:hover {
  background: var(--nx-button);
  color: var(--nx-on-accent) !important;
}

/* =========================================================
   6. CATEGORIE E TAG (pill)
   ========================================================= */
/* Categorie nel byline: testo semplice, senza padding da "pill"
   (senza sfondo il padding creava solo buchi e andava a capo).
   Zeen mostra solo la categoria principale (use_primary_cat). */
.cat,
.cat-links a {
  padding: 0;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tagcloud a,
.tags a,
.post-tags a {
  border-radius: var(--nx-radius-pill);
  padding: .25em .8em;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.tagcloud a,
.tags a,
.post-tags a {
  background: var(--nx-surface);
  color: var(--nx-text);
  transition: background .2s var(--nx-ease), color .2s var(--nx-ease);
}
.tagcloud a:hover,
.tags a:hover,
.post-tags a:hover { background: var(--nx-accent); color: var(--nx-on-accent); }

/* =========================================================
   7. HERO / HEADER: sempre nero (fisso, sticky, mobile)
   ========================================================= */
#masthead,
.site-header,
.site-header-block,
.main-navigation,
.main-navigation .menu-bg-area,
.site-header .bg-area {
  background-color: var(--nx-header-bg) !important;
}

/* Testo, logo e icone dell'header in chiaro su sfondo nero */
.site-header,
.site-header a,
.main-navigation a,
.site-header .logo a,
.site-header svg,
.site-header .icon {
  color: var(--nx-header-text);
}
.site-header .site-description,
.site-header .tagline {
  color: var(--nx-header-muted);
}

/* Primo livello */
.main-navigation > ul > li > a,
.main-menu > li > a,
#menu-main > li > a,
.menu-wrap > ul > li > a {
  font-weight: 500;
  font-size: .95rem;
  letter-spacing: -.01em;
  padding: .5em .9em;
  border-radius: var(--nx-radius-pill);
  color: var(--nx-header-text);
  transition: background .2s var(--nx-ease), color .2s var(--nx-ease);
}

.main-navigation > ul > li:hover > a,
.main-menu > li:hover > a,
#menu-main > li:hover > a,
.menu-wrap > ul > li:hover > a,
.current-menu-item > a,
.current-menu-ancestor > a {
  background: var(--nx-header-surface);
  color: #fff;
}

/* Secondo livello (dropdown): vetro scuro coerente con l'header */
.sub-menu {
  min-width: 220px;
  padding: .5rem !important;
  border: 1px solid var(--nx-header-border) !important;
  border-radius: var(--nx-radius-img) !important;
  background: color-mix(in srgb, var(--nx-header-bg-solid) 92%, transparent) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  box-shadow: var(--nx-shadow) !important;
  overflow: hidden;
}

.sub-menu li a {
  display: block;
  padding: .6em .9em;
  border-radius: var(--nx-radius-sm);
  font-size: .9rem;
  color: var(--nx-header-text);
  transition: background .15s var(--nx-ease), color .15s var(--nx-ease);
}
.sub-menu li a:hover {
  background: var(--nx-header-surface);
  color: #fff;
}

/* Header sticky con effetto vetro: resta nero, non torna mai bianco */
.site-header.is-stuck,
.header-sticky,
.sticky-header,
.sticky-header--active.site-header,
.site-header.sticky-menu-2.stuck,
.site-header.slidedown,
#masthead.sticky {
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  background: color-mix(in srgb, var(--nx-header-bg-solid) 92%, transparent) !important;
  border-bottom: 1px solid var(--nx-header-border);
}

/* Header mobile: stessa coerenza nera */
.mobile-header,
.site-mob-header .bg-area,
.mobile-navigation,
.mobile-navigation-2,
.menu-mobile,
.header-mobile-icons {
  background-color: var(--nx-header-bg) !important;
  color: var(--nx-header-text);
}
.menu-mobile a,
.mobile-navigation a {
  color: var(--nx-header-text);
}
.menu-mobile .sub-menu,
.mobile-navigation .sub-menu {
  background: var(--nx-header-bg-solid) !important;
}

/* =========================================================
   8. ARTICOLO SINGOLO: leggibilita'
   ========================================================= */
/* Testo dell'articolo: 17px su mobile -> 18px su desktop.
   Solo nel corpo del testo (non nella home del page builder ne' nella sidebar). */
body:not(.tipi-builder-page) .entry-content {
  font-size: clamp(17px, 16px + .3vw, 18px);
  line-height: 1.7;
}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
  margin: 1.6em 0 .6em;
}

.entry-content p,
.single-content p { margin-bottom: 1.4em; }

.entry-content a:not(.tipi-button):not(.nx-cta):not(.wp-block-button__link):not(.nexmind-app-box a):not(.nxo-link):not(.nxp-nav a):not(.nxp-news a):not(.nxp-cta):not(.nxp-card):not(.nxp-sources a):not(.nx-byauthor a) {
  color: var(--nx-accent-text);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* Solo le immagini nel testo: non le miniature (.mask) ne' l'apertura (.hero),
   che Zeen dimensiona al riquadro con object-fit: cover */
.entry-content img:not(.mask img, .hero img, .avatar),
.single-content img:not(.mask img, .hero img, .avatar, .byline img) { margin-block: 1.2rem; }

/* Citazioni: semplici. Solo una linea arancione a sinistra, niente
   sfondo, niente icona "virgolette" di Zeen, testo poco piu' grande
   del corpo. (Esclusi i post di X/Instagram prima del caricamento.) */
.entry-content blockquote:not(.twitter-tweet):not(.instagram-media) {
  margin: 1.8rem 0;
  padding: .1rem 0 .1rem 1.25rem;
  border: 0;
  border-left: 3px solid var(--nx-accent);
  border-radius: 0;
  background: none;
  color: var(--nx-text);
  font-size: 1.08em;
  font-style: italic;
  line-height: 1.6;
}
.entry-content blockquote:not(.twitter-tweet):not(.instagram-media)::before,
.entry-content blockquote:not(.twitter-tweet):not(.instagram-media)::after { display: none; }
.site .entry-content blockquote:not(.twitter-tweet):not(.instagram-media) p {
  margin: 0 0 .6em;
  font-size: inherit;
  font-style: inherit;
  color: inherit;
}
.site .entry-content blockquote:not(.twitter-tweet):not(.instagram-media) p:last-child { margin-bottom: 0; }
.entry-content blockquote cite {
  display: block;
  margin-top: .5em;
  font-size: .8em;
  font-style: normal;
  color: var(--nx-muted);
}

code,
pre {
  border-radius: var(--nx-radius-sm);
  background: var(--nx-surface);
  font-size: .9em;
}
code { padding: .15em .4em; }
pre { padding: 1rem 1.2rem; overflow-x: auto; }
pre code { padding: 0; background: transparent; }

/* Tabelle (utili per confronti prodotto) */
.entry-content table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius-img);
  overflow: hidden;
}
.entry-content th,
.entry-content td {
  padding: .8em 1em;
  border-bottom: 1px solid var(--nx-border);
}
.entry-content tr:last-child td { border-bottom: 0; }
.entry-content th { background: var(--nx-surface); text-align: left; }

/* =========================================================
   9. FORM E INPUT (newsletter, ricerca, commenti)
   ========================================================= */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
textarea,
select {
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius-sm);
  background: var(--nx-surface);
  color: var(--nx-text);
  padding: .8em 1em;
  transition: border-color .2s var(--nx-ease), box-shadow .2s var(--nx-ease);
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--nx-accent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--nx-accent) 25%, transparent);
}

/* =========================================================
   10. COMPONENTI NEXMIND (usati dagli shortcode PHP)
   ========================================================= */
/* Box pro / contro per le recensioni */
.nx-procontro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 2rem 0;
}
.nx-procontro > div {
  padding: 1.2rem 1.4rem;
  border-radius: var(--nx-radius-img);
  background: var(--nx-surface);
}
.nx-procontro h4 { margin: 0 0 .6rem; font-size: 1rem; }
.nx-procontro ul { margin: 0; padding-left: 1.1rem; }
.nx-procontro .nx-pro h4 { color: #1d7a34; }
.nx-procontro .nx-contro h4 { color: #d70015; }

/* Disclosure affiliazione */
.nx-disclosure {
  margin: 1.5rem 0;
  padding: .8rem 1.1rem;
  border-radius: var(--nx-radius-sm);
  background: var(--nx-surface);
  color: var(--nx-muted);
  font-size: .85rem;
}

/* === Shortcode [app] & [leggi] ===
   Stile originale del vecchio child theme (recuperato/tema/zeen-child/style.css).
   Unica modifica: i colori fissi (#000, #888, #666, bordi) usano i token,
   cosi' il box resta leggibile anche in dark mode. */
.nexmind-app-box {
    display: flex;
    gap: 18px;
    align-items: center;
    border-top: 1px solid var(--nx-border);
    border-bottom: 1px solid var(--nx-border);
    padding: 20px 0;
}
.nexmind-app-box .app-icon img {
    width: 80px;
    height: 80px;
    margin: 0;
    border-radius: 14px;
    object-fit: cover;
    box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}
.nexmind-app-box .app-info {
    flex: 1;
    padding-left: 12px;
}
.nexmind-app-box .app-title {
    font-size: 17px;
    font-weight: bold;
    color: var(--nx-text);
    margin-bottom: 4px;
    line-height: 1.4;
}
.site .entry-content .nexmind-app-box .app-title a {
    color: var(--nx-accent-text);
    text-decoration: none;
}
.site .entry-content .nexmind-app-box .app-title a:hover { color: var(--nx-accent); }
/* [leggi] e [app]: titolo nero (bianco in dark), arancione al passaggio
   del mouse su tutto il box. Solo con il mouse: su iPhone l'hover
   resterebbe attivo dopo il tocco. */
.site .entry-content .nexmind-app-box .app-title,
.site .entry-content .nexmind-app-box .app-title a { color: var(--nx-text); transition: color .15s ease; }
@media (hover: hover) {
  .site .entry-content .nexmind-app-box:hover .app-title,
  .site .entry-content .nexmind-app-box:hover .app-title a { color: var(--nx-accent-text); }
  .nexmind-app-box[data-type="app"]:hover .scarica-btn { background: #E65C00; }
}
/* Box interamente cliccabile: il link (titolo per [leggi], "Scarica"
   per [app]) si estende a tutto il riquadro con uno pseudo-elemento */
.nexmind-app-box { position: relative; margin: 0 0 1.4em; }
.site .entry-content .nexmind-app-box .app-title a,
.site .entry-content .nexmind-app-box .scarica-btn { position: static; }
.nexmind-app-box[data-type="leggi"] .app-title a::after,
.nexmind-app-box[data-type="app"] .scarica-btn::after {
  content: "";
  position: absolute;
  inset: 0;
}
/* L'immagine e' "inline": lasciava 10px vuoti sotto (spazio della riga
   di testo), quindi lo spazio sotto era maggiore di quello sopra */
.nexmind-app-box .app-icon { line-height: 0; }
.nexmind-app-box .app-icon img { display: block; }
.nexmind-app-box .app-dev {
    font-size: 13px;
    color: var(--nx-muted);
    margin-bottom: 4px;
}
.nexmind-app-box .scarica-btn {
    background: #FF6A00;
    color: #fff !important;
    font-size: 12px;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 10px;
    text-decoration: none;
    white-space: nowrap;
}
.nexmind-app-box .scarica-btn:hover {
    background: #E65C00;
}
/* 16:9 come le copertine (1280x720): a 180x120 (3:2) i lati venivano tagliati */
.nexmind-app-box[data-type="leggi"] .app-icon img {
    width: 192px;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}
/* Label "Leggi anche" sopra il titolo (stessa della label "L'autore") */
.nexmind-app-box .app-label,
.nx-author__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--nx-accent-text);
    margin: 0 0 4px;
    line-height: 1.3;
}
.nexmind-app-box[data-type="leggi"] .app-meta {
    font-size: 12px;
    color: var(--nx-muted);
    margin-top: 6px;
}

/* Il margine verticale delle immagini nel testo non vale per i box */
.site .entry-content .nexmind-app-box .app-icon img { margin: 0; }

@media (max-width: 600px) {
    .nexmind-app-box {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .nexmind-app-box .app-info {
        padding-left: 0;
        margin-top: 10px;
    }
    .nexmind-app-box[data-type="leggi"] .app-icon img {
        width: 100%;
        height: auto;
    }
}

/* Notizia principale (layout Zeen 77: prima notizia in home e nelle
   sezioni prodotto): titolo grande come l'apertura di The Verge */
.block-wrap-77 .title-wrap .title {
  font-size: clamp(24px, 1.2rem + 1.4vw, 34px);
  line-height: 1.15;
  letter-spacing: -.02em;
}
.block-wrap-77 .excerpt { font-size: 16px; }

/* Footer a colonne (template-parts/footer/footer-2.php del child):
   marchio + due colonne di link, poi copyright. Sempre nero. */
.nx-footer { background: var(--nx-header-bg); color: var(--nx-header-muted); }
.nx-footer__top {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr));
  gap: 48px;
  padding-top: 56px;
  padding-bottom: 48px;
}
.nx-footer__brand .logo { margin: 0 0 16px; text-align: left; }
.nx-footer__brand .logo img { height: 30px; width: auto; }
.nx-footer__about,
.nx-footer__about p {
  max-width: 380px;
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--nx-header-muted);
}
.nx-footer__about h3,
.nx-footer__about .widget-title { display: none; }
.nx-footer__about strong { color: var(--nx-header-text); font-weight: 600; }
.nx-footer__about .widget,
.nx-footer__about .footer-widget { margin: 0; padding: 0 !important; }
.nx-footer .nx-footer__social { display: flex; justify-content: flex-start !important; text-align: left; margin: 20px 0 0 -8px; }
.nx-footer__social a { color: var(--nx-header-text) !important; }
.nx-footer__title {
  margin: 0 0 14px;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--nx-header-text) !important;
}
.nx-footer__links { margin: 0; padding: 0; list-style: none; }
.nx-footer__links li { margin: 0 0 10px; }
.nx-footer__links a {
  font-size: 14px;
  color: var(--nx-header-muted) !important;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 0;
  transition: color .2s var(--nx-ease);
}
.nx-footer__links a:hover { color: var(--nx-accent) !important; }
.nx-footer__links .current-menu-item > a { color: var(--nx-header-text) !important; background: none; padding: 0; }
.nx-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 20px;
  padding-bottom: 28px;
  border-top: 1px solid var(--nx-header-border);
  font-size: 13px;
}
.nx-footer__bottom .copyright { margin: 0; color: var(--nx-header-muted) !important; }
@media (max-width: 859px) {
  .nx-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; padding-top: 40px; }
  .nx-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .nx-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Articolo su mobile: meno spazio sopra il byline e sotto i social,
   avatar piccolo e allineato, tempo di lettura nascosto (andava a capo
   da solo lasciando un puntino orfano) */
@media (max-width: 767px) {
  .single .single-content.contents-wrap { padding-top: 16px; }
  .single .hero-meta { padding-bottom: 16px; }
  .hero-meta .byline { display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px; }
  .hero-meta .byline .author-avatar,
  .hero-meta .byline .author-avatar a { display: inline-flex; height: auto; margin-top: 0; margin-bottom: 0; }
  .hero-meta .byline .author-avatar img { width: 22px; height: 22px; }
  .hero-meta .byline .separator-readtime,
  .hero-meta .byline .read-time { display: none; }
}

/* Mobile: nelle sezioni con foto sopra e testo sotto (iPhone, Mac, iPad,
   AI: layout Zeen 71 e 21; articoli correlati: layout 29) categoria,
   data e titolo centrati.
   Le liste con miniatura a fianco restano allineate a sinistra. */
@media (max-width: 767px) {
  .preview-71 .meta,
  .preview-21 .meta,
  .preview-29 .meta { text-align: center; }
  .preview-71 .byline,
  .preview-21 .byline,
  .preview-29 .byline { justify-content: center; }
  .preview-71 .title,
  .preview-21 .title,
  .preview-29 .title { text-wrap: balance; }
}

/* Articoli correlati (in fondo agli articoli): titolo "Correlati" staccato
   dalla linea arancione sopra, card con categoria, data e titolo centrati
   anche su desktop */
.related-posts-wrap .block-title-wrap { padding-top: 22px; margin-bottom: 22px; }
.related-posts-wrap .preview-29 .meta { text-align: center; }
.related-posts-wrap .preview-29 .byline { justify-content: center; }
.related-posts-wrap .preview-29 .title { text-wrap: balance; }

/* Mobile, liste con titolo di sezione (Ultime News, iOS): il primo
   articolo diventa "grande" come nella sezione iPhone (foto a tutta
   larghezza, testo centrato sotto); gli altri restano in elenco compatto.
   Esclusi i blocchi "in evidenza" in cima (non hanno titolo di sezione). */
@media (max-width: 767px) {
  .block-title-wrap ~ .block-1 > .preview-1:first-child .preview-mini-wrap { flex-direction: column; }
  .block-title-wrap ~ .block-1 > .preview-1:first-child .mask {
    flex: 0 0 auto;
    width: 100%;
    margin: 0 0 16px;
  }
  .block-title-wrap ~ .block-1 > .preview-1:first-child .meta {
    width: 100%;
    padding: 0;
    text-align: center;
  }
  .block-title-wrap ~ .block-1 > .preview-1:first-child .byline { justify-content: center; }
  .block-title-wrap ~ .block-1 > .preview-1:first-child .title {
    font-size: 21px;
    text-wrap: balance;
  }
}

/* Tempo di lettura */
.nx-reading-time { color: var(--nx-muted); font-size: .85rem; }

/* Barra di progresso lettura */
#nx-progress {
  position: fixed;
  top: 0; left: 0;
  width: 0; height: 3px;
  background: var(--nx-accent);
  z-index: 99999;
  transition: width .1s linear;
}

/* Box offerta (per collegarlo al canale Telegram) */
.nx-deal {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin: 1.5rem 0;
  padding: 1rem 1.2rem;
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius-img);
  background: var(--nx-surface);
}
.nx-deal img { width: 88px; height: 88px; object-fit: cover; }
.nx-deal__price { font-size: 1.3rem; font-weight: 700; }
.nx-deal__old { color: var(--nx-muted); text-decoration: line-through; margin-left: .4rem; font-size: .95rem; }

@media (max-width: 640px) {
  .nx-procontro { grid-template-columns: 1fr; }
  .nx-deal { flex-direction: column; text-align: center; }
}

/* =========================================================
   11. CORREZIONI AL TEMA ZEEN (chiaro + scuro)
   ========================================================= */
/* Titoli di sezione della home: nel page builder hanno un colore bianco
   scritto a mano (<span style="color:#ffffff">), invisibile sul bianco.
   Cosi' seguono il colore dei titoli di Zeen in entrambe le modalita'. */
.block-title span[style*="color"] { color: inherit !important; }

/* Categoria sopra il titolo dell'articolo: Zeen scrive il colore della
   categoria in linea (#ff6a00), poco leggibile su bianco */
html:not(.nx-dark) .hero-meta a.cat[style*="color"] { color: var(--nx-accent-text) !important; }

/* Meno arancione: nel byline data, autore e tempo di lettura sono grigi
   (impostazione Zeen color_byline), l'arancione resta solo sulla categoria.
   Le card con il testo sopra l'immagine hanno regole proprie (bianco). */
.preview-classic .byline .cats a,
.preview-mini-wrap .byline .cats a,
.block-wrap-classic .byline .cats a,
.hero-meta .byline .cats a { color: var(--nx-accent-text); }
html.nx-dark .hero-meta a.cat[style*="color"] { color: var(--nx-accent-text) !important; }

/* Mobile, liste con miniatura a lato: la colonna e' stretta e la data andava
   a capo lasciando il puntino orfano. Categoria sopra, data sotto. */
@media (max-width: 767px) {
  .preview-classic .byline .cats { display: block; }
  .preview-classic .byline .cats + .separator-date { display: none; }
}

/* Card con testo sopra l'immagine (hero mobile): Zeen su mobile
   azzera il margine laterale e il testo tocca il bordo della foto */
@media (max-width: 767px) {
  .meta-overlay-base .preview-mini-wrap .meta { padding-left: 20px !important; padding-right: 20px !important; }
}

/* Accenti arancioni (seconda prova, "meno spento"):
   barretta accanto ai titoli di sezione, titoli dei widget,
   hover sui titoli degli articoli, voce di menu attiva/hover. */
.block-title-area .block-title {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: auto;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
}
.block-title-area .block-title::before {
  content: "";
  flex: 0 0 4px;
  width: 4px;
  height: .8em;
  margin: 0;
  border-radius: 4px;
  background: var(--nx-accent);
}
/* Zeen su mobile disegna due linee decorative ai lati del titolo */
.block-title-area .block-title::after { display: none; }
.block-title-area .block-title p { margin: 0; padding: 0; white-space: nowrap; }
/* Su mobile Zeen centra i titoli di sezione: allineati a sinistra come le liste */
@media (max-width: 767px) {
  .block-title-wrap { justify-content: flex-start; }
  .block-title-area { text-align: left; margin-left: 0; margin-right: auto; }
}
html .sidebar-widget .widget-title { color: var(--nx-accent-text) !important; }

.preview-classic .title a,
.preview-mini-wrap .title a { transition: color .2s var(--nx-ease); }
/* Solo con il mouse: su iPhone l'hover resta "attaccato" dopo il tocco */
@media (hover: hover) {
  .preview-classic:hover .title a,
  .preview-mini-wrap:hover .title a { color: var(--nx-accent-text); }
}

.main-navigation .menu-item > a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current-post-ancestor > a { color: var(--nx-accent) !important; background: none; }

/* Descrizione sotto il titolo delle pagine categoria: grigio troppo chiaro */
.block-subtitle,
.site .block-subtitle p { color: var(--nx-muted); }

/* Lo sfondo dell'header usa la classe .mask: niente angoli arrotondati */
.background.mask { border-radius: 0; }

/* Etichette grigie troppo chiare su bianco ("Condividi", ordinamento) */
.share-it .title,
.sorter .current-txt { color: var(--nx-muted); }

/* Ricerca a tutto schermo: in dark mode Zeen la lascia bianca */
html.nx-dark .tipi-overlay-modal { background-color: var(--nx-bg); }
html.nx-dark #modal .content-search,
html.nx-dark #modal .search-field { color: var(--nx-text); }
html.nx-dark #modal .search-field::placeholder { color: var(--nx-muted); opacity: 1; }
html.nx-dark #modal .search-hints,
html.nx-dark #modal .search-hints a { color: var(--nx-muted); }
html.nx-dark #modal .search-hints a:hover { color: var(--nx-accent-text); }
html.nx-dark #modal .tipi-i-close { color: var(--nx-text); }

/* =========================================================
   12. ACCESSIBILITA' E PERFORMANCE
   ========================================================= */
:focus-visible {
  outline: 3px solid var(--nx-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* :where() = specificita' zero, cosi' non batte le regole di Zeen
   (es. ".mask img { height: 100% }" delle miniature) */
:where(img) { height: auto; max-width: 100%; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .mask img { transform: none !important; }
}

/* Home (pagina del builder): l'ultima sezione (AI) toccava il footer.
   Le altre pagine hanno gia' 56-120px. */
.tipi-builder-page .site-content { padding-bottom: 64px; }
@media (max-width: 767px) {
  .tipi-builder-page .site-content { padding-bottom: 40px; }
}

/* Box autore in fondo all'articolo: linea sopra con tratto arancione,
   foto quadrata arrotondata, niente fondo pieno. */
.nx-author {
  position: relative;
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 20px;
  margin: 40px 0 32px;
  padding: 28px 0 0;
  border-top: 1px solid var(--nx-border);
}
.nx-author::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  width: 48px;
  height: 3px;
  background: var(--nx-accent);
  border-radius: 2px;
}
.nx-author__photo { display: block; line-height: 0; }
.nx-author .nx-author__img {
  width: 72px;
  height: 72px;
  margin: 0;
  border-radius: 18px;
  object-fit: cover;
}
.nx-author__body p { margin: 0; }
.nx-author .nx-author__name { font-size: 20px; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; }
.nx-author .nx-author__name a { color: var(--nx-text); text-decoration: none; }
.nx-author .nx-author__role { font-size: 14px; color: var(--nx-muted); margin-top: 2px; }
.nx-author .nx-author__bio { font-size: 16px; line-height: 1.6; color: var(--nx-text); margin-top: 10px; }
.nx-author .nx-author__links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin-top: 12px;
  font-size: 14px;
  font-weight: 600;
}
.nx-author .nx-author__links a { color: var(--nx-accent-text); text-decoration: none; }
@media (hover: hover) {
  .nx-author .nx-author__name a:hover,
  .nx-author .nx-author__links a:hover { color: var(--nx-accent); }
}
@media (max-width: 600px) {
  .nx-author { grid-template-columns: 56px 1fr; gap: 14px; }
  .nx-author .nx-author__img { width: 56px; height: 56px; border-radius: 14px; }
  .nx-author .nx-author__name { font-size: 18px; }
  .nx-author .nx-author__bio { font-size: 15px; }
}

/* ---------------------------------------------------------
   Pagina "Tutte le notizie" (/news/, template home.php del child)
   ------------------------------------------------------- */
.blog .nx-news-header { margin-bottom: 8px; }
@media (max-width: 767px) {
  /* stesso margine della home (Zeen aggiunge 20px agli archivi)
     e miniatura allineata in alto con i titoli lunghi */
  .blog .main .block-1 > article { padding-left: 0; padding-right: 0; }
  .blog .main .block-1 .preview-mini-wrap { align-items: flex-start; }
}

/* Home: "Carica altro" delle liste larghe 2/3 (Ultime News, iOS) al centro
   della pagina come nelle sezioni a tutta larghezza (iPhone), non al centro
   della colonna. Il contenitore del bottone si allarga sotto la colonna
   "I più letti": colonna 1/3 = (2/3 - 15px) / 2, spazio tra colonne 30px
   → servono meta' della colonna + 22,5px. Da 860px (colonne affiancate). */
@media (min-width: 860px) {
  .zeen-col-sz-66 .load-more-wrap-1 { margin-right: calc(-50% - 22.5px); }
}

/* Icona play sulle copertine degli articoli video: piu' piccola e
   semitrasparente (vetro sfocato) per non coprire la foto. L'area
   cliccabile e la centratura di Zeen restano invariate: si rimpicciolisce
   solo il cerchio disegnato (.icon-bg) e il triangolo. */
.media-icon.icon-base-1 .icon-bg {
  background: rgba(0, 0, 0, .28);
  border: 1.5px solid rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: none;
  transform: scale(.62);
}
.media-icon.icon-base-1.icon-size-s .icon-bg { transform: scale(.75); }
.media-icon.icon-base-1 i { color: rgba(255, 255, 255, .92); font-size: 17px; }
.media-icon.icon-base-1.icon-size-s i { font-size: 13px; }
.media-icon.icon-base-1:hover .icon-bg,
article:hover .media-icon.icon-base-1 .icon-bg {
  background: rgba(0, 0, 0, .42);
  box-shadow: none;
  transform: scale(.68);
}
.media-icon.icon-base-1.icon-size-s:hover .icon-bg,
article:hover .media-icon.icon-base-1.icon-size-s .icon-bg { transform: scale(.82); }
/* niente ingrandimento dell'intera icona al passaggio (solo il cerchio) */
.icon-base-1.media-icon.center-abs:hover { transform: translate(-50%, -50%); }

/* Autore sotto le icone social, con "Segui" (functions.php 8m) */
.hero-meta .nx-byauthor { clear: both; display: flex; align-items: center; gap: 12px; width: 100%; padding-top: 16px; }
.hero-meta .nx-byauthor__who { display: inline-flex; align-items: center; gap: 10px; color: var(--nx-text); text-decoration: none; }
.hero-meta .nx-byauthor__img { width: 32px; height: 32px; margin: 0; border-radius: 50%; object-fit: cover; }
.hero-meta .nx-byauthor__name { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.hero-meta .nx-follow {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 11px 4px 9px; border: 1px solid var(--nx-border); border-radius: var(--nx-radius-pill);
  color: var(--nx-text); font-size: 13px; font-weight: 600; line-height: 1.2; text-decoration: none;
  transition: background-color .2s var(--nx-ease), color .2s var(--nx-ease), border-color .2s var(--nx-ease);
}
.hero-meta .nx-follow svg { flex: none; display: block; }
@media (hover: hover) {
  .hero-meta .nx-byauthor__who:hover .nx-byauthor__name { color: var(--nx-accent-text); }
  .hero-meta .nx-follow:hover { border-color: var(--nx-text); }
}
.hero-meta .nx-follow:focus-visible { outline: 2px solid var(--nx-accent); outline-offset: 2px; }

/* =========================================================
   ACCESSIBILITA' (PageSpeed del 06/10/2026)
   ========================================================= */
/* Arancione per testo piccolo su bianco: #c24e00, contrasto 4,8:1
   (#e65c00 era 3,6:1, sotto il minimo 4,5:1). In dark mode resta #ff7a1a. */
:root {
  --nx-accent-text: #c24e00;
  /* Bottoni arancioni con testo bianco: #c24e00 (4,8:1, prima #d45500 4,1:1).
     Stessi valori in Zeen: Carica altro, torna su, contatti, iscrizione. */
  --nx-button: #c24e00;
  --nx-button-hover: #a84300;
}
/* Consiglio "Compra" delle guide: verde piu' scuro (5,4:1, prima 4,4:1) */
.site .nxp-advice.is-compra .nxp-advice-label,
.site .nxp-advice-mini.is-compra { background: #1d7a34; }
html:not(.nx-dark) .site-content .cat { color: var(--nx-accent-text) !important; }
/* Blocchi con sfondo nero (hero della home): arancione chiaro, 8:1 */
html .site-content .block-skin-bg-4 .cat { color: #ff7a1a !important; }
/* Categorie: area di tocco di almeno 24px */
.site-content .cat { display: inline-block; padding-block: 4px; }
/* Categorie sopra le foto (blocchi con testo in sovrimpressione): restano bianche */
html .site-content [class*="meta-overlay"] .cat { color: #fff !important; }
/* Sotto le foto con testo in sovrimpressione: fondo scuro mentre l'immagine si carica
   (Zeen usa #eee, il testo bianco sarebbe illeggibile per un istante) */
.site-content [class*="meta-overlay"] .hero { background-color: #1d1d1f; }

/* =========================================================
   HEADER MOBILE COMPATTO (06/10/2026)
   Era alto 76 px con il logo a 36 px: ora 52 px e logo a 22 px,
   il contenuto sale e il logo non domina lo schermo.
   ========================================================= */
#mobhead .header-padding { padding-top: 0 !important; padding-bottom: 0 !important; min-height: 52px; }
#mobhead .bg-area { height: 52px; }
#mobhead .logo-mobile img { height: 22px !important; width: auto !important; }
#mobhead .logo-mobile,
#mobhead .logo-mobile a,
#mobhead .logo-img { height: auto !important; line-height: 0; }
#mobhead { box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .14); }

/* =========================================================
   HOME MOBILE: APERTURA + ELENCO (07/10/2026)
   Le due fasce nere in cima alla home, sotto i 768 px: la prima
   notizia con la foto grande e il titolo sotto (e' anche l'immagine
   che Google misura per la velocita', LCP), le altre tre in righe
   compatte con la miniatura a destra.
   ========================================================= */
@media (max-width: 767px) {
.home .block-skin-bg-4 > .tipi-row-inner-style > .tipi-row-inner-box { padding-left: 16px !important; padding-right: 16px !important; border: 0 !important; }
.home .block-skin-bg-4 .zeen-col { width: 100% !important; margin: 0 !important; padding: 0 !important; }
.home .block-skin-bg-4 .block-is-nest,
.home .block-skin-bg-4 .block-is-nest > .tipi-row-inner-style,
.home .block-skin-bg-4 .block-is-nest .tipi-row-inner-box { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.home .block-skin-bg-4 article { margin: 0 !important; padding: 14px 0 !important; border: 0 !important; border-top: 1px solid rgba(255, 255, 255, .14) !important; border-radius: 0 !important; }
.home .block-skin-bg-4:last-of-type article:last-child { padding-bottom: 20px !important; }
.home .block-skin-bg-4 .meta, .home .block-skin-bg-4 .meta * { padding-left: 0 !important; padding-right: 0 !important; }
.home .block-skin-bg-4 .title-wrap { margin: 0 !important; }
/* Righe: miniatura 112x63 a destra, senza data (Zeen: clearfix e angoli arrotondati tagliavano testo e spazi) */
.home .block-skin-bg-4 article .preview-mini-wrap { display: flex !important; flex-direction: row-reverse; justify-content: space-between; align-items: flex-start; gap: 14px; border-radius: 0 !important; overflow: visible !important; }
.home .block-skin-bg-4 article .preview-mini-wrap::before, .home .block-skin-bg-4 article .preview-mini-wrap::after { display: none !important; }
.home .block-skin-bg-4 article .mask { position: relative !important; float: none !important; flex: 0 0 112px; width: 112px !important; max-width: 112px !important; height: 63px !important; margin: 0 !important; border-radius: 8px; overflow: hidden; }
.home .block-skin-bg-4 article .mask::after { display: none !important; }
.home .block-skin-bg-4 article .mask img { width: 100% !important; height: 100% !important; object-fit: cover; }
.home .block-skin-bg-4 article .meta { position: static !important; float: none !important; flex: 1 1 auto; min-width: 0; width: auto !important; max-width: none !important; padding-top: 0 !important; padding-bottom: 0 !important; transform: none !important; background: none !important; }
.home .block-skin-bg-4 article .cat { color: #ff7a1a !important; }
.home .block-skin-bg-4 article .title { font-size: 16px !important; line-height: 1.3 !important; padding-top: 4px !important; }
.home .block-skin-bg-4 article .byline .date, .home .block-skin-bg-4 article .byline .separator { display: none !important; }
/* Apertura: foto 16:9 a tutta larghezza, titolo sotto */
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 article { border-top: 0 !important; padding-top: 16px !important; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 article .preview-mini-wrap { display: block !important; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 .mask { float: none !important; flex: none; width: 100% !important; max-width: none !important; height: auto !important; margin: 0 0 12px !important; border-radius: 12px; overflow: hidden; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 .mask img { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; object-fit: cover; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 .meta { width: 100% !important; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 .title { font-size: 24px !important; line-height: 1.2 !important; }
.home .block-skin-bg-4.block-wrap-cols-2-1 .zeen-col-0 .byline .date { display: inline !important; }
/* Giunzione di mezzo pixel tra le due fasce nere: niente riga chiara */
.home .block-skin-bg-4 + .block-skin-bg-4 { box-shadow: 0 -1px 0 #000; }
}

/* =========================================================
   "FONTI PREFERITE" DI GOOGLE (07/10/2026), in fondo all'articolo
   ========================================================= */
.nx-gsrc { display: flex; align-items: center; gap: 16px; margin: 32px 0 0; padding: 16px 18px; border: 1px solid var(--nx-border); border-radius: 14px; background: var(--nx-surface); }
.nx-gsrc__text { flex: 1; min-width: 0; font-size: 14px; line-height: 1.45; color: var(--nx-muted); }
.nx-gsrc__text strong { display: block; margin-bottom: 2px; font-size: 15px; font-weight: 600; color: var(--nx-text); }
.entry-content .nx-gsrc__btn { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--nx-border); border-radius: var(--nx-radius-pill); background: var(--nx-bg); color: var(--nx-text) !important; font-size: 14px; font-weight: 600; text-decoration: none !important; white-space: nowrap; }
.entry-content .nx-gsrc__btn:hover { border-color: var(--nx-muted); }
.nx-gsrc__btn svg { width: 16px; height: 16px; }
.nx-gsrc + .nxs-invite { margin-top: 18px; }
@media (max-width: 520px) { .nx-gsrc { flex-direction: column; align-items: flex-start; gap: 12px; } }