/* articolo-chatgpt — stili specifici di pagina, condivisi tra la versione
   italiana e quella tedesca. Estratti dal blocco <style> inline: erano
   duplicati identici in due file e non venivano mai messi in cache. */
/* ===== /blog/come-farsi-citare-da-chatgpt — page-specific styles ===== */

/* Breadcrumb */
.breadcrumb-nav{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--muted);font-family:'JetBrains Mono',monospace;margin-bottom:24px;flex-wrap:wrap;}
.breadcrumb-nav a{color:var(--muted);text-decoration:none;transition:color .2s;}
.breadcrumb-nav a:hover{color:var(--text);}
.breadcrumb-nav .sep{opacity:.35;}

/* Article tag */
.art-tag{font-size:.7rem;font-family:'JetBrains Mono',monospace;padding:3px 10px;border-radius:4px;border:1px solid rgba(129,140,248,.3);color:#a5b4fc;background:rgba(129,140,248,.06);display:inline-block;}

/* Article hero */
.art-hero{padding:130px 0 56px;position:relative;}
.art-hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 50% 40% at 50% 30%,rgba(129,140,248,.07) 0%,transparent 65%);pointer-events:none;}
.art-hero-inner{max-width:760px;}
.art-hero-meta{display:flex;align-items:center;gap:12px;margin:20px 0 24px;flex-wrap:wrap;}
.art-meta-dot{width:3px;height:3px;border-radius:50%;background:var(--muted);opacity:.4;flex-shrink:0;}
.art-meta-item{font-size:.75rem;font-family:'JetBrains Mono',monospace;color:var(--muted);}
.art-hero h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;line-height:1.18;margin:0 0 24px;}
.art-hero .art-intro{font-size:1.1rem;color:var(--muted);line-height:1.8;max-width:680px;}
.art-author-row{display:flex;align-items:center;gap:12px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.07);}
.art-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;flex-shrink:0;}
.art-author-name{font-size:.88rem;font-weight:600;color:var(--text);}
.art-author-role{font-size:.75rem;color:var(--muted);margin-top:1px;}

/* Article layout */
.art-layout{display:grid;grid-template-columns:1fr 240px;gap:48px;align-items:start;padding-bottom:80px;}

/* TOC sidebar */
.art-toc{position:sticky;top:100px;background:var(--bg2);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:20px 20px 24px;}
.toc-label{font-size:.68rem;font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);display:block;margin-bottom:14px;}
.art-toc ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;counter-reset:toc;}
.art-toc ol li{counter-increment:toc;display:flex;gap:8px;align-items:baseline;}
.art-toc ol li::before{content:counter(toc,decimal-leading-zero);font-size:.6rem;font-family:'JetBrains Mono',monospace;color:var(--blue3);flex-shrink:0;margin-top:1px;}
.art-toc ol li a{font-size:.82rem;color:var(--muted);text-decoration:none;line-height:1.45;transition:color .2s;}
.art-toc ol li a:hover{color:var(--text);}
.art-toc ol li a.active{color:var(--blue3);}

/* Article body */
.art-body h2{font-size:1.5rem;font-weight:800;margin:48px 0 16px;padding-top:8px;color:var(--text);line-height:1.25;}
.art-body h2:first-child{margin-top:0;}
.art-body h3{font-size:1.1rem;font-weight:700;margin:28px 0 12px;color:var(--text);}
.art-body p{font-size:.96rem;color:var(--muted);line-height:1.85;margin-bottom:16px;}
.art-body p:last-child{margin-bottom:0;}
.art-body strong{color:var(--text);}
.art-body ul,.art-body ol{padding-left:0;margin:16px 0 20px;display:flex;flex-direction:column;gap:8px;list-style:none;}
.art-body ul li,.art-body ol li{font-size:.95rem;color:var(--muted);line-height:1.7;padding-left:18px;position:relative;}
.art-body ul li::before{content:'—';position:absolute;left:0;color:var(--blue2);font-size:.8rem;}
.art-body ol{counter-reset:ol-counter;}
.art-body ol li{counter-increment:ol-counter;}
.art-body ol li::before{content:counter(ol-counter)'.';position:absolute;left:0;color:var(--blue2);font-size:.8rem;font-family:'JetBrains Mono',monospace;}
.art-body a{color:var(--blue2);text-decoration:none;border-bottom:1px solid rgba(46,154,245,.3);transition:border-color .2s,color .2s;}
.art-body a:hover{color:var(--blue3);border-bottom-color:rgba(96,184,255,.5);}
.art-body a[href^="http"]::after{content:'↗';font-size:.65em;margin-left:2px;vertical-align:super;opacity:.6;}
.art-body code{font-family:'JetBrains Mono',monospace;font-size:.85em;color:var(--blue3);background:rgba(46,154,245,.08);padding:1px 6px;border-radius:4px;}
.art-body pre{background:var(--bg2);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:16px 18px;margin:16px 0 20px;overflow-x:auto;}
.art-body pre code{font-family:'JetBrains Mono',monospace;font-size:.82rem;color:var(--text);background:none;padding:0;line-height:1.7;white-space:pre;}

/* Callout box */
.art-callout{background:var(--bg2);border:1px solid rgba(255,255,255,.08);border-left:3px solid var(--green);border-radius:0 10px 10px 0;padding:18px 22px;margin:24px 0;}
.art-callout p{font-size:.9rem;margin:0;line-height:1.7;}

/* Data table */
.art-table-wrap{overflow-x:auto;margin:20px 0;}
.art-table{width:100%;border-collapse:collapse;font-size:.875rem;}
.art-table th{text-align:left;padding:10px 14px;background:var(--bg2);color:var(--text);font-weight:600;border-bottom:1px solid rgba(255,255,255,.08);}
.art-table th:first-child{border-radius:8px 0 0 0;}
.art-table th:last-child{border-radius:0 8px 0 0;}
.art-table td{padding:10px 14px;color:var(--muted);border-bottom:1px solid rgba(255,255,255,.04);}
.art-table tr:last-child td{border-bottom:none;}

/* FAQ */
.art-faq{padding-top:40px;margin-top:40px;border-top:1px solid rgba(255,255,255,.07);}
.art-faq h2{font-size:1.4rem;font-weight:800;margin:0 0 24px;}
.faq-item{border-bottom:1px solid rgba(255,255,255,.06);padding:18px 0;}
.faq-item:last-child{border-bottom:none;}
.faq-q{font-size:.95rem;font-weight:600;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;background:none;border:none;width:100%;text-align:left;padding:0;}
.faq-q:hover{color:var(--blue3);}
.faq-icon{font-size:1.1rem;color:var(--muted);flex-shrink:0;transition:transform .25s;}
.faq-item.open .faq-icon{transform:rotate(45deg);}
.faq-a{font-size:.9rem;color:var(--muted);line-height:1.75;max-height:0;overflow:hidden;transition:max-height .35s ease,padding .25s;}
.faq-item.open .faq-a{max-height:300px;padding-top:12px;}

/* Related articles */
.art-related{padding:40px 0 80px;border-top:1px solid rgba(255,255,255,.06);}
.art-related h2{font-size:1.2rem;font-weight:800;margin:0 0 24px;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;}
.related-card{background:var(--bg2);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:22px 22px 20px;text-decoration:none;display:block;transition:border-color .25s,transform .25s;}
.related-card:hover{border-color:rgba(46,154,245,.25);transform:translateY(-3px);}
.related-card-tag{font-size:.68rem;font-family:'JetBrains Mono',monospace;color:var(--muted);display:block;margin-bottom:10px;}
.related-card h3{font-size:.96rem;font-weight:700;color:var(--text);line-height:1.35;margin:0 0 8px;}
.related-card p{font-size:.82rem;color:var(--muted);line-height:1.6;margin:0;}

/* Nav active */
.nav-active{color:var(--blue3) !important;}

/* Responsive */
@media(max-width:900px){
  .art-layout{grid-template-columns:1fr;}
  .art-toc{position:static;margin-bottom:32px;}
  .art-toc ol{flex-direction:row;flex-wrap:wrap;gap:6px 16px;}
  .art-toc ol li::before{display:none;}
}
@media(max-width:640px){
  .art-hero{padding:110px 0 40px;}
  .art-hero h1{font-size:1.8rem;}
  .art-body h2{font-size:1.3rem;}
}
