/*
Theme Name: Chicco Tech Completo V16.7
Theme URI: https://www.chiccotech.it
Author: Federico Morocutti
Description: Tema pulito Chicco Tech: dark minimal, home hero, ultimi video YouTube via API, filtro Shorts, menu responsive, footer personalizzabile.
Version: 16.4 - JetBrains Mono + Articoli Premium
Text Domain: chicco-tech
*/

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800;900&display=swap');

:root{
  --yellow:#ffff00;
  --bg:#020202;
  --white:#ffffff;
  --line:rgba(255,255,255,.12);

  --font-code:'JetBrains Mono', monospace;
  --font-title:'JetBrains Mono', monospace;
  --footer-text-font:'JetBrains Mono', monospace;
  --about-bio-font:'JetBrains Mono', monospace;

  --header-height:86px;
  --header-height-mobile:76px;

  --logo-height:54px;
  --logo-width:320px;
  --logo-height-mobile:40px;
  --logo-width-mobile:210px;

  --youtube-columns:3;
  --youtube-radius:26px;
  --youtube-title-size:22px;
  --youtube-title-color:#ffff00;
  --youtube-title-transform:uppercase;
  --youtube-title-weight:700;
  --youtube-title-font:var(--font-title);
  --youtube-card-bg:#070707;
  --youtube-play-size:48px;

  --footer-top-bg:#050505;
  --footer-top-text:#ffffff;
  --footer-bottom-bg:#ffff00;
  --footer-bottom-text:#000000;
}

*{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
  background:var(--bg);
  color:var(--white);
  font-family:var(--font-code);
  overflow-x:hidden;
}

body{
  line-height:1.65;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}

/* HEADER */
.site-header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:var(--header-height);
  background:transparent !important;
  background-color:transparent !important;
  border-bottom:1px solid transparent !important;
  z-index:9999;
  box-shadow:none !important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:background-color .4s ease-in-out, border-color .4s ease-in-out, box-shadow .4s ease-in-out, backdrop-filter .4s ease-in-out;
}

.header-inner{
  height:var(--header-height);
  width:100%;
  max-width:1480px;
  margin:0 auto;
  padding:0 36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}

.logo{
  flex:0 0 auto;
  max-width:var(--logo-width);
  overflow:hidden;
  display:flex;
  align-items:center;
}

.logo a{
  display:flex;
  align-items:center;
  color:var(--yellow);
  font-family:var(--font-code);
  font-size:26px;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}

.logo img,
.logo .custom-logo,
.custom-logo-link img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-height:var(--logo-height) !important;
  max-width:var(--logo-width) !important;
  object-fit:contain !important;
}

/* MENU DESKTOP */
.main-navigation{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  min-width:0;
}

.main-menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(22px,3vw,46px);
  white-space:nowrap;
}

.main-menu a{
  font-family:var(--font-code);
  font-size:18px;
  font-weight:650;
  letter-spacing:-.035em;
  line-height:1;
  color:var(--white);
}

.main-menu a:hover,
.main-menu .current-menu-item > a{
  color:var(--yellow);
}

.main-menu li:last-child a{
  border:2px solid var(--white);
  border-radius:999px;
  padding:10px 26px;
}

.main-menu li:last-child a:hover{
  border-color:var(--yellow);
}

/* HAMBURGER */
.menu-toggle{
  display:none;
  width:42px;
  height:42px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  z-index:10001;
}

.menu-toggle span{
  display:block;
  width:30px;
  height:3px;
  background:var(--yellow);
  margin:6px 0;
}

.menu-toggle.active span:nth-child(1){transform:translateY(9px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}

/* HERO */
.hero{
  min-height:720px;
  padding:calc(var(--header-height) + 100px) 36px 120px;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
  background:#020202;
  border-bottom:1px solid var(--line);
}

.hero-content{
  width:100%;
  max-width:1480px;
  margin:0 auto;
  position:relative;
  z-index:2;
}

.hero-inner{max-width:760px}

.eyebrow{
  color:var(--yellow);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:22px;
}

.hero h1{
  color:var(--yellow);
  font-size:clamp(52px,6vw,88px);
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.03em;
  margin:0 0 30px;
  text-shadow:0 0 20px rgba(255,255,0,.35);
  font-family:var(--font-title);
  font-weight:900;
  letter-spacing:-0.04em;
}

.hero p{
  color:var(--white);
  font-size:22px;
  line-height:1.7;
  max-width:720px;
  margin:0 0 36px;
}

.btn-outline,
.youtube-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--yellow);
  color:#000;
  border:2px solid var(--yellow);
  border-radius:999px;
  padding:15px 32px;
  font-family:var(--font-code);
  font-size:17px;
  font-weight:800;
  line-height:1;
}

.btn-outline:hover,
.youtube-button:hover{
  background:#000;
  color:var(--yellow);
}

/* SECTIONS */
.site-main,
.youtube-section{
  max-width:1480px;
  margin:0 auto;
  padding:76px 36px;
}

.youtube-section{
  border-bottom:1px solid var(--line);
  padding-bottom:56px;
  overflow:hidden;
}

.section-title{
  color:var(--yellow);
  text-transform:uppercase;
  font-size:26px;
  margin:0 0 36px;
  letter-spacing:.08em;
}

/* YOUTUBE */
.youtube-grid{
  display:grid;
  grid-template-columns:repeat(var(--youtube-columns),1fr);
  gap:32px;
}

.youtube-card{
  background:var(--youtube-card-bg);
  border:1px solid rgba(255,255,255,.09);
  overflow:hidden;
  border-radius:var(--youtube-radius);
  transition:border-color .25s ease, box-shadow .25s ease;
}

.youtube-card:hover{
  border-color:rgba(255,255,0,.55);
  box-shadow:0 0 34px rgba(255,255,0,.08);
}

.youtube-thumb-wrap{
  position:relative;
  display:block;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#111;
}

.youtube-thumb{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.youtube-thumb-wrap:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 100%);
  pointer-events:none;
}

.youtube-play{
  position:absolute;
  left:18px;
  bottom:18px;
  width:var(--youtube-play-size);
  height:var(--youtube-play-size);
  border-radius:999px;
  background:var(--yellow);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 0 26px rgba(255,255,0,.45);
  z-index:2;
}

.youtube-play svg{
  width:42%;
  height:42%;
  margin-left:4px;
  fill:#000;
}

.youtube-card.play-center .youtube-play{
  left:50%;
  top:50%;
  bottom:auto;
  transform:translate(-50%,-50%);
}

.youtube-card.play-outline .youtube-play{
  background:rgba(0,0,0,.55);
  border:2px solid var(--yellow);
  box-shadow:none;
}

.youtube-card.play-outline .youtube-play svg{fill:var(--yellow)}
.youtube-card.play-none .youtube-play{display:none}

.youtube-body{padding:24px}

.youtube-date{
  color:var(--yellow);
  font-size:13px;
  font-weight:900;
  margin-bottom:12px;
  text-transform:uppercase;
}

.youtube-title,
.youtube-title a{
  color:var(--youtube-title-color) !important;
  font-family:var(--youtube-title-font) !important;
  font-size:var(--youtube-title-size);
  font-weight:var(--youtube-title-weight) !important;
  text-transform:var(--youtube-title-transform) !important;
  line-height:1.25;
}

.youtube-title{
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.youtube-empty{
  border:1px solid rgba(255,255,255,.12);
  padding:24px;
  background:#070707;
}

.youtube-actions{
  display:flex;
  justify-content:center;
  margin-top:40px;
}

/* POSTS */
.posts-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
}

.card{
  background:#070707;
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}

.card:hover{border-color:rgba(255,255,0,.5)}

.card-thumb{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#111;
}

.card-body{padding:24px}

.card-date{
  color:var(--yellow);
  font-size:13px;
  font-weight:900;
  margin-bottom:12px;
}

.card h2{
  color:var(--yellow);
  text-transform:uppercase;
  font-size:23px;
  line-height:1.25;
  margin:0 0 15px;
}

.card p{
  color:var(--white);
  font-size:16px;
  margin:0 0 18px;
}

.read-more{
  color:var(--yellow);
  font-weight:900;
  font-size:14px;
  text-transform:uppercase;
}

/* PAGES */
.content-area{
  padding-top:calc(var(--header-height) + 70px);
  min-height:70vh;
}

.entry-title{
  color:var(--yellow);
  text-transform:uppercase;
  font-size:clamp(38px,5vw,68px);
  line-height:1.05;
  margin:0 0 34px;
}

.content-area p,
.content-area li{
  font-size:18px;
  line-height:1.8;
}

.content-area h2,
.content-area h3{
  color:var(--yellow);
  text-transform:uppercase;
  margin-top:34px;
}

/* FOOTER */
.site-footer{
  margin-top:70px;
  border-top:1px solid var(--line);
}

.footer-top{
  background:var(--footer-top-bg);
  color:var(--footer-top-text);
  padding:26px 36px;
}

.footer-bottom{
  background:var(--footer-bottom-bg);
  color:var(--footer-bottom-text);
  padding:26px 36px;
  font-weight:700;
}

.footer-inner{
  max-width:1480px;
  margin:0 auto;
}

.footer-top a,
.footer-bottom a{text-decoration:underline}

/* RESPONSIVE */
@media(max-width:1100px){
  .header-inner{padding:0 24px}
  .main-menu{gap:22px}
  .main-menu a{font-size:15px}
}

@media(max-width:920px){
  .posts-grid,
  .youtube-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:760px){
  .site-header{
    height:var(--header-height-mobile);
    overflow:visible;
  }

  .header-inner{
    height:var(--header-height-mobile);
    padding:0 20px;
  }

  .logo{max-width:var(--logo-width-mobile)}
  .logo a{font-size:18px}

  .logo img,
  .logo .custom-logo,
  .custom-logo-link img{
    max-height:var(--logo-height-mobile) !important;
    max-width:var(--logo-width-mobile) !important;
  }

  .menu-toggle{
    display:block;
    flex:0 0 auto;
  }

  .main-navigation{
    position:fixed;
    top:var(--header-height-mobile);
    right:-100%;
    width:100%;
    background:#000;
    border-top:1px solid var(--line);
    padding:18px 24px 26px;
    display:block;
    box-shadow:0 18px 35px rgba(0,0,0,.65);
  }

  .main-navigation.active{right:0}

  .main-menu{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:4px;
    white-space:normal;
    width:100%;
    text-align:center;
  }

  .main-menu li{width:100%}

  .main-menu a{
    display:block;
    width:100%;
    padding:14px 0;
    background:transparent;
    border:none;
    border-radius:0;
    font-family:var(--font-code);
    font-size:18px;
    font-weight:700;
    letter-spacing:-.03em;
    text-transform:none;
    line-height:1.1;
    color:#fff;
    text-align:center;
  }

  .main-menu li:last-child a{
    border:none;
    border-radius:0;
    padding:14px 0;
  }

  .hero{
    min-height:650px;
    padding:calc(var(--header-height-mobile) + 58px) 24px 70px;
  }

  .hero h1{font-size:48px}
  .hero p{font-size:18px}

  .btn-outline,
  .youtube-button{
    width:100%;
    max-width:320px;
  }

  .site-main,
  .youtube-section{padding:50px 24px}

  .youtube-grid{
    display:flex;
    overflow-x:auto;
    gap:18px;
    scroll-snap-type:x mandatory;
    scroll-padding:24px;
    -webkit-overflow-scrolling:touch;
    padding:0 24px 22px;
    margin:0 -24px;
    scrollbar-width:none;
  }

  .youtube-grid::-webkit-scrollbar{display:none}

  .youtube-card{
    flex:0 0 84%;
    scroll-snap-align:center;
  }

  .posts-grid{grid-template-columns:1fr}
  .content-area{padding-top:calc(var(--header-height-mobile) + 50px)}
  .footer-top,.footer-bottom{padding:24px}
}


/* ==================================================
   HEADER TRASPARENTE DA FERMO / NERO ALLO SCROLL
   ================================================== */

.site-header{
  background:transparent !important;
  background-color:transparent !important;
  border-bottom:1px solid transparent !important;
  box-shadow:none !important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:
    background-color .4s ease-in-out,
    border-color .4s ease-in-out,
    box-shadow .4s ease-in-out,
    backdrop-filter .4s ease-in-out;
}

.site-header.sticky-header{
  background:rgba(0,0,0,.92) !important;
  background-color:rgba(0,0,0,.92) !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 2px 20px rgba(0,0,0,.35) !important;
}

.site-header .header-inner{
  background:transparent !important;
}

.site-header .main-navigation a{
  color:#ffffff;
  transition:color .25s ease;
}

.site-header .main-navigation a:hover,
.site-header .main-menu .current-menu-item > a{
  color:#ffff00;
}

.site-header .main-menu li:last-child a{
  border:2px solid #ffffff;
  border-radius:999px;
  padding:10px 26px;
  transition:all .25s ease;
}

.site-header .main-menu li:last-child a:hover{
  background:#ffff00;
  border-color:#ffff00;
  color:#000000 !important;
}

@media(max-width:760px){
  .site-header.mobile-open{
    background:#000000 !important;
    background-color:#000000 !important;
  }

  .site-header.mobile-open .header-inner{
    background:transparent !important;
  }

  .main-navigation.active{
    background:#000000 !important;
  }
}


/* ==================================================
   V11 - ARTICOLI UGUALI AI VIDEO YOUTUBE
   Usa direttamente le classi .youtube-grid e .youtube-card
   ================================================== */

.articles-youtube-section{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:76px 36px !important;
}

.articles-youtube-grid{
  display:grid !important;
  grid-template-columns:repeat(var(--youtube-columns),1fr) !important;
  gap:32px !important;
}

.article-youtube-card{
  background:var(--youtube-card-bg) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  overflow:hidden !important;
  border-radius:var(--youtube-radius) !important;
}

.article-youtube-card .youtube-thumb-wrap{
  aspect-ratio:16/9 !important;
}

.article-youtube-card .youtube-thumb{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

.article-youtube-card .youtube-title,
.article-youtube-card .youtube-title a{
  color:var(--youtube-title-color, #ffff00) !important;
  font-family:var(--youtube-title-font, var(--font-code)) !important;
  font-size:var(--youtube-title-size, 23px) !important;
  font-weight:var(--youtube-title-weight, 700) !important;
  text-transform:var(--youtube-title-transform, uppercase) !important;
  line-height:1.25 !important;
}

.article-youtube-card .article-youtube-excerpt{
  color:#ffffff !important;
  opacity:.82 !important;
  font-family:var(--font-code) !important;
  font-size:16px !important;
  line-height:1.55 !important;
  margin:16px 0 0 !important;
}

/* Hover articoli: come YouTube, resta nero con bordo e bagliore giallo sottile */
@media (hover:hover) and (pointer:fine){
  .article-youtube-card:hover{
    background:var(--youtube-card-bg) !important;
    border-color:rgba(255,255,0,.85) !important;
    box-shadow:0 0 18px rgba(255,255,0,.22) !important;
    transform:translateY(-4px) !important;
  }

  .article-youtube-card:hover .youtube-body{
    background:transparent !important;
  }

  .article-youtube-card:hover .youtube-date,
  .article-youtube-card:hover .youtube-title,
  .article-youtube-card:hover .youtube-title a,
  .article-youtube-card:hover .article-youtube-excerpt{
    color:var(--yellow) !important;
  }

  .article-youtube-card:hover .youtube-thumb{
    transform:scale(1.025) !important;
    filter:saturate(1.06) contrast(1.04) !important;
  }
}

/* Mobile/tablet: esattamente come i video YouTube */
@media(max-width:920px){
  .articles-youtube-section{
    overflow:hidden !important;
    padding:50px 24px !important;
  }

  .articles-youtube-grid{
    display:flex !important;
    overflow-x:auto !important;
    gap:18px !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding:24px !important;
    -webkit-overflow-scrolling:touch !important;
    padding:0 24px 22px !important;
    margin:0 -24px !important;
    scrollbar-width:none !important;
  }

  .articles-youtube-grid::-webkit-scrollbar{
    display:none !important;
  }

  .articles-youtube-grid .article-youtube-card{
    flex:0 0 84% !important;
    width:84% !important;
    min-width:84% !important;
    max-width:84% !important;
    scroll-snap-align:center !important;
  }
}


/* Pulsante fondo articoli */
.articles-all-wrap{
  display:flex !important;
  justify-content:center !important;
  margin-top:42px !important;
}

.articles-all-button{
  min-width:240px !important;
  text-align:center !important;
}


/* ==================================================
   SEZIONE CHI SONO
   Desktop: biografia a sinistra, foto a destra
   Mobile: foto sopra, biografia sotto
   ================================================== */
.about-section{
  max-width:1480px;
  margin:0 auto;
  padding:76px 36px;
  border-top:1px solid var(--line);
}

.about-inner{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);
  gap:56px;
  align-items:center;
}

.about-eyebrow{
  color:var(--yellow);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:16px;
}

.about-title{
  color:var(--yellow);
  text-transform:uppercase;
  font-size:clamp(38px,4.5vw,68px);
  line-height:1.05;
  margin:0 0 26px;
  text-shadow:0 0 20px rgba(255,255,0,.18);
}

.about-text{
  color:#ffffff;
  font-size:19px;
  line-height:1.8;
  max-width:760px;
}

.about-text p{
  margin:0 0 18px;
}

.about-text p:last-child{
  margin-bottom:0;
}

.about-photo-wrap{
  justify-self:end;
  width:100%;
  max-width:520px;
}

.about-photo,
.about-photo-placeholder{
  width:100%;
  aspect-ratio:1/1;
  border-radius:32px;
  border:1px solid rgba(255,255,255,.12);
  background:#070707;
  box-shadow:0 0 38px rgba(255,255,0,.08);
}

.about-photo{
  display:block;
  object-fit:cover;
}

.about-photo-placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--yellow);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

@media(max-width:760px){
  .about-section{
    padding:54px 24px;
  }

  .about-inner{
    display:flex;
    flex-direction:column-reverse;
    gap:30px;
    align-items:stretch;
  }

  .about-photo-wrap{
    max-width:100%;
    justify-self:auto;
  }

  .about-photo,
  .about-photo-placeholder{
    border-radius:24px;
  }

  .about-title{
    font-size:40px;
  }

  .about-text{
    font-size:17px;
    line-height:1.75;
  }
}


/* ==================================================
   V16 FIX REALE - CHI SONO COME CARD VIDEO + CACHE BUST
   ================================================== */
.articles-all-wrap{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  width:100% !important;
  max-width:1480px !important;
  margin:42px auto 0 !important;
  text-align:center !important;
}
.articles-all-wrap .youtube-button,
.articles-all-button{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.about-section.chicco-about-v16{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:76px 36px !important;
  border-top:1px solid var(--line) !important;
  overflow:hidden !important;
}
.chicco-about-v16 .section-title{
  margin-bottom:52px !important;
}
.chicco-about-card{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(360px,0.82fr) !important;
  gap:0 !important;
  align-items:stretch !important;
  background:var(--youtube-card-bg,#070707) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-radius:var(--youtube-radius,26px) !important;
  overflow:hidden !important;
  box-shadow:0 0 34px rgba(255,255,0,.08) !important;
}
.chicco-about-card .about-copy{
  padding:54px 56px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  min-width:0 !important;
}
.chicco-about-card .about-eyebrow{
  color:var(--yellow,#ffff00) !important;
  font-family:var(--youtube-title-font,var(--font-code)) !important;
  font-size:22px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  margin:0 0 24px !important;
}
.chicco-about-card .about-title{
  color:#ffffff !important;
  font-family:var(--youtube-title-font,var(--font-code)) !important;
  font-size:clamp(38px,4.2vw,64px) !important;
  font-weight:900 !important;
  line-height:1.08 !important;
  text-transform:none !important;
  margin:0 0 26px !important;
  text-shadow:none !important;
}
.chicco-about-card .about-text{
  max-width:760px !important;
  color:#ffffff !important;
  font-family:var(--about-bio-font,var(--font-code)) !important;
  font-size:var(--about-bio-size-desktop,22px) !important;
  font-weight:var(--about-bio-weight,400) !important;
  line-height:var(--about-bio-line-height,1.75) !important;
}
.chicco-about-card .about-photo-wrap{
  width:100% !important;
  max-width:none !important;
  min-height:520px !important;
  justify-self:stretch !important;
  align-self:stretch !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#000 !important;
  padding:0 24px !important;
}
.chicco-about-card .about-photo,
.chicco-about-card .about-photo-placeholder{
  width:100% !important;
  height:100% !important;
  max-height:620px !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
@media(max-width:920px){
  .about-section.chicco-about-v16{
    padding:50px 24px !important;
  }
  .chicco-about-card{
    grid-template-columns:1fr !important;
  }
  .chicco-about-card .about-copy{
    padding:34px 28px !important;
    order:2 !important;
  }
  .chicco-about-card .about-photo-wrap{
    order:1 !important;
    min-height:0 !important;
    padding:18px 18px 0 !important;
  }
  .chicco-about-card .about-photo,
  .chicco-about-card .about-photo-placeholder{
    height:auto !important;
    max-height:460px !important;
  }
  .chicco-about-card .about-text{
    font-size:var(--about-bio-size-mobile,17px) !important;
    line-height:var(--about-bio-line-height,1.7) !important;
  }
}


/* Sezione Contattami - design definitivo */
.contact-section{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:76px 36px !important;
  border-top:1px solid var(--line) !important;
}
.contact-section .section-title{
  margin-bottom:48px !important;
}
.contact-card{
  position:relative !important;
  background:var(--youtube-card-bg,#070707) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:var(--youtube-radius,26px) !important;
  padding:54px 58px !important;
  overflow:hidden !important;
  box-shadow:0 0 34px rgba(255,255,0,.08) !important;
}
.contact-card:before{
  content:"" !important;
  position:absolute !important;
  inset:0 0 auto 0 !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(255,255,0,.65), rgba(255,255,0,0)) !important;
}
.contact-intro{
  max-width:980px !important;
  color:#fff !important;
  font-family:var(--font-code) !important;
  font-size:clamp(18px,1.6vw,24px) !important;
  line-height:1.55 !important;
  margin:0 0 34px !important;
}
.contact-intro p{margin:0 !important;}
.contact-form{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:24px !important;
  max-width:1050px !important;
}
.contact-field{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  min-width:0 !important;
}
.contact-field:nth-of-type(3),
.contact-captcha,
.contact-privacy,
.contact-submit{
  grid-column:1 / -1 !important;
}
.contact-field label{
  color:var(--yellow,#ffff00) !important;
  font-family:var(--youtube-title-font,var(--font-code)) !important;
  font-size:15px !important;
  font-weight:900 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
}
.contact-field input,
.contact-field textarea{
  width:100% !important;
  box-sizing:border-box !important;
  appearance:none !important;
  background:#000 !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:18px !important;
  color:#fff !important;
  font-family:var(--font-code) !important;
  font-size:18px !important;
  line-height:1.4 !important;
  padding:18px 20px !important;
  outline:none !important;
  box-shadow:none !important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
.contact-field textarea{
  min-height:210px !important;
  resize:vertical !important;
}
.contact-field input:focus,
.contact-field textarea:focus{
  border-color:var(--yellow,#ffff00) !important;
  box-shadow:0 0 0 4px rgba(255,255,0,.12) !important;
}
.contact-captcha{
  max-width:430px !important;
}
.contact-privacy{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  color:#fff !important;
  font-family:var(--font-code) !important;
  font-size:17px !important;
  line-height:1.45 !important;
  margin:2px 0 0 !important;
}
.contact-privacy input{
  width:22px !important;
  height:22px !important;
  margin:0 !important;
  accent-color:var(--yellow,#ffff00) !important;
  flex:0 0 auto !important;
}
.contact-privacy a{
  color:var(--yellow,#ffff00) !important;
  font-weight:900 !important;
  text-decoration:none !important;
}
.contact-privacy a:hover{text-decoration:underline !important;}
.contact-submit{
  justify-self:start !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:220px !important;
  border:0 !important;
  border-radius:999px !important;
  background:var(--yellow,#ffff00) !important;
  color:#000 !important;
  font-family:var(--youtube-title-font,var(--font-code)) !important;
  font-weight:900 !important;
  font-size:18px !important;
  line-height:1 !important;
  padding:20px 34px !important;
  cursor:pointer !important;
  box-shadow:0 0 24px rgba(255,255,0,.18) !important;
  transition:transform .18s ease, box-shadow .18s ease !important;
}
.contact-submit:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 0 36px rgba(255,255,0,.28) !important;
}
.contact-alert{
  max-width:1050px !important;
  margin:0 0 26px !important;
  padding:16px 18px !important;
  border-radius:16px !important;
  font-family:var(--font-code) !important;
  font-weight:900 !important;
}
.contact-alert.success{background:var(--yellow,#ffff00) !important;color:#000 !important;}
.contact-alert.error{background:#210000 !important;color:#fff !important;border:1px solid rgba(255,255,255,.18) !important;}
@media(max-width:920px){
  .contact-section{padding:50px 24px !important;}
  .contact-card{padding:32px 22px !important;}
  .contact-form{grid-template-columns:1fr !important;gap:20px !important;}
  .contact-field:nth-of-type(3),.contact-captcha,.contact-privacy,.contact-submit{grid-column:auto !important;}
  .contact-intro{font-size:17px !important;margin-bottom:26px !important;}
  .contact-field label{font-size:14px !important;}
  .contact-field input,.contact-field textarea{font-size:16px !important;padding:15px 16px !important;border-radius:15px !important;}
  .contact-field textarea{min-height:180px !important;}
  .contact-captcha{max-width:none !important;}
  .contact-privacy{font-size:15px !important;}
  .contact-submit{width:100% !important;min-width:0 !important;}
}


/* ==================================================
   V16.1 - FIX INTEGRATI NEL TEMA, SENZA CSS AGGIUNTIVO
   ================================================== */

html{scroll-behavior:smooth;}

/* Menu: voci sempre bianche, gialle solo al passaggio mouse */
.main-menu a,
.main-menu .current-menu-item > a,
.main-menu .current_page_item > a,
.site-header .main-navigation a,
.site-header .main-navigation .current-menu-item > a,
.site-header .main-navigation .current_page_item > a{
  color:var(--footer-top-text, #ffffff) !important;
}

.main-menu a:hover,
.site-header .main-navigation a:hover{
  color:#ffff00 !important;
}

/* Mantiene lo stile pill dell'ultima voce menu, ma senza diventare gialla da attiva */
.main-menu li:last-child a{
  color:#ffffff !important;
  border-color:#ffffff !important;
}
.main-menu li:last-child a:hover{
  background:#ffff00 !important;
  border-color:#ffff00 !important;
  color:#000000 !important;
}

/* Titolo hero: desktop con spazio tra CHICCO e TECH, mobile CHICCO sopra TECH */
.hero-title span{
  display:inline;
}
.hero-title span + span{
  margin-left:.34em;
}

@media(max-width:760px){
  .hero-title{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:0 !important;
    line-height:.86 !important;
    white-space:normal !important;
  }

  .hero-title span{
    display:block !important;
  }
  .hero-title span + span{
    margin-left:0 !important;
  }
}

/* Chi sono: desktop testo a sinistra/foto a destra, mobile foto sopra/testo sotto */
@media(max-width:920px){
  .chicco-about-card .about-photo-wrap{
    order:1 !important;
  }
  .chicco-about-card .about-copy{
    order:2 !important;
  }
}

/* ==================================================
   V16.2 - FOOTER SOCIAL INTEGRATO
   ================================================== */
.chicco-footer{
  margin-top:80px !important;
  padding:42px 36px !important;
  background:var(--footer-top-bg, #050505) !important;
  border-top:1px solid rgba(255,255,0,.18) !important;
  color:#ffffff !important;
}

.chicco-footer .footer-grid{
  max-width:1480px !important;
  margin:0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:34px !important;
}

.footer-brand{
  color:#ffff00 !important;
  font-family:var(--font-title, monospace) !important;
  font-weight:900 !important;
  letter-spacing:.04em !important;
  font-size:24px !important;
  margin-bottom:18px !important;
  text-transform:uppercase !important;
}

.footer-legal p{
  margin:8px 0 !important;
  font-family:var(--footer-text-font, monospace) !important;
  font-size:var(--footer-top-size, 16px) !important;
  font-weight:var(--footer-top-weight, 400) !important;
  line-height:1.6 !important;
  color:var(--footer-top-text, #ffffff) !important;
}


.footer-custom-text{
  color:var(--footer-top-text, #ffffff) !important;
  font-family:var(--footer-text-font, monospace) !important;
  font-size:var(--footer-top-size, 16px) !important;
  font-weight:var(--footer-top-weight, 400) !important;
  line-height:1.6 !important;
}
.footer-custom-text p{
  margin:8px 0 !important;
  font-family:inherit !important;
  font-size:inherit !important;
  font-weight:inherit !important;
  line-height:inherit !important;
}
.footer-custom-text a{
  color:var(--footer-top-text, #ffffff) !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,255,.35) !important;
}
.footer-custom-text a:hover{
  color:#ffff00 !important;
  border-color:#ffff00 !important;
}

.footer-legal a{
  color:var(--footer-top-text, #ffffff) !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,255,.35) !important;
}

.footer-legal a:hover{
  color:#ffff00 !important;
  border-color:#ffff00 !important;
}

.footer-copy{
  opacity:.75 !important;
  font-size:14px !important;
  margin-top:16px !important;
}

.footer-socials{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:16px !important;
  flex-wrap:wrap !important;
}

.footer-socials a{
  width:58px !important;
  height:58px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.35) !important;
  border-radius:999px !important;
  color:#ffffff !important;
  text-decoration:none !important;
  background:rgba(255,255,255,.03) !important;
  transition:transform .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease !important;
}

.footer-socials a svg{
  width:25px !important;
  height:25px !important;
  fill:currentColor !important;
}

.footer-socials a span{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
}

.footer-socials a:hover{
  color:#ffff00 !important;
  border-color:#ffff00 !important;
  transform:translateY(-3px) !important;
  box-shadow:0 0 22px rgba(255,255,0,.24) !important;
}

@media(max-width:760px){
  .chicco-footer{
    padding:34px 22px !important;
    text-align:center !important;
  }
  .chicco-footer .footer-grid{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:28px !important;
  }
  .footer-legal p{
    font-size:15px !important;
  }
  .footer-socials{
    justify-content:center !important;
  }
  .footer-socials a{
    width:54px !important;
    height:54px !important;
  }
}


/* ==================================================
   V16.3 - COPYRIGHT BAR SEPARATA
   ================================================== */
.footer-copy{
  display:none !important;
}

.chicco-copyright-bar{
  width:100% !important;
  background:var(--footer-bottom-bg, #ffff00) !important;
  color:var(--footer-bottom-text, #000000) !important;
  padding:16px 22px !important;
  text-align:center !important;
  font-family:var(--footer-text-font, monospace) !important;
  font-weight:var(--footer-bottom-weight, 900) !important;
  letter-spacing:.02em !important;
  font-size:var(--footer-bottom-size, 15px) !important;
  border-top:1px solid rgba(0,0,0,.15) !important;
}

.chicco-copyright-bar .copyright-inner{
  max-width:1480px !important;
  margin:0 auto !important;
}

@media(max-width:760px){
  .chicco-copyright-bar{
    padding:14px 18px !important;
    font-size:calc(var(--footer-bottom-size, 15px) * .9) !important;
    line-height:1.35 !important;
  }
}


/* ==================================================
   V16.4 - ARTICOLI PIÙ LEGGIBILI E PROFESSIONALI
   Stile blog tech / editor di codice
   ================================================== */

.posts-grid{
  gap:34px !important;
}

.card,
.article-youtube-card{
  position:relative !important;
  background:linear-gradient(180deg, #090909 0%, #050505 100%) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:26px !important;
  overflow:hidden !important;
  box-shadow:0 0 0 rgba(255,255,0,0) !important;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease !important;
}

.card:before,
.article-youtube-card:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:100% !important;
  height:1px !important;
  background:linear-gradient(90deg, rgba(255,255,0,.55), rgba(255,255,0,0)) !important;
  z-index:2 !important;
  pointer-events:none !important;
}

.card:hover,
.article-youtube-card:hover{
  background:linear-gradient(180deg, #0b0b0b 0%, #050505 100%) !important;
  border-color:rgba(255,255,0,.72) !important;
  transform:translateY(-6px) !important;
  box-shadow:0 0 30px rgba(255,255,0,.13) !important;
}

.card-thumb,
.article-youtube-card .youtube-thumb{
  transition:transform .36s ease, filter .36s ease !important;
}

.card:hover .card-thumb,
.article-youtube-card:hover .youtube-thumb{
  transform:scale(1.045) !important;
  filter:saturate(1.08) contrast(1.05) !important;
}

.card-body,
.article-youtube-card .youtube-body{
  padding:28px !important;
}

.card-date,
.article-youtube-card .youtube-date{
  color:var(--yellow,#ffff00) !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  margin:0 0 14px !important;
  text-transform:uppercase !important;
  letter-spacing:.12em !important;
  opacity:.92 !important;
}

.card h2,
.card h2 a,
.article-youtube-card .youtube-title,
.article-youtube-card .youtube-title a{
  color:var(--yellow,#ffff00) !important;
  font-family:var(--font-title,'JetBrains Mono',monospace) !important;
  font-size:clamp(24px, 1.7vw, 32px) !important;
  font-weight:800 !important;
  line-height:1.15 !important;
  letter-spacing:-.045em !important;
  text-transform:none !important;
  margin:0 0 18px !important;
  text-shadow:0 0 18px rgba(255,255,0,.10) !important;
}

.card p,
.article-youtube-card .article-youtube-excerpt{
  color:#d8d8d8 !important;
  opacity:1 !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:16.5px !important;
  font-weight:400 !important;
  line-height:1.75 !important;
  letter-spacing:-.018em !important;
  margin:0 0 20px !important;
}

.read-more,
.articles-all-button,
.youtube-button{
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-weight:900 !important;
  letter-spacing:-.025em !important;
}

.read-more{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  color:var(--yellow,#ffff00) !important;
  font-size:14px !important;
  text-transform:uppercase !important;
}

.read-more:after{
  content:"→" !important;
  transition:transform .18s ease !important;
}

.card:hover .read-more:after{
  transform:translateX(4px) !important;
}

/* Pagina articolo: più leggibile e pulita */
.single .content-area,
.page .content-area{
  max-width:980px !important;
  margin:0 auto !important;
  padding-left:36px !important;
  padding-right:36px !important;
}

.entry-title{
  font-family:var(--font-title,'JetBrains Mono',monospace) !important;
  font-weight:900 !important;
  letter-spacing:-.055em !important;
  text-transform:none !important;
  color:var(--yellow,#ffff00) !important;
  text-shadow:0 0 24px rgba(255,255,0,.16) !important;
}

.content-area p,
.content-area li{
  color:#e8e8e8 !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:19px !important;
  line-height:1.85 !important;
  letter-spacing:-.02em !important;
}

.content-area h2,
.content-area h3{
  font-family:var(--font-title,'JetBrains Mono',monospace) !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
  text-transform:none !important;
  margin-top:48px !important;
  margin-bottom:18px !important;
}

.content-area a{
  color:var(--yellow,#ffff00) !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,0,.45) !important;
}

.content-area a:hover{
  border-bottom-color:var(--yellow,#ffff00) !important;
}

@media(max-width:920px){
  .posts-grid{
    gap:24px !important;
  }

  .card-body,
  .article-youtube-card .youtube-body{
    padding:24px !important;
  }

  .card h2,
  .card h2 a,
  .article-youtube-card .youtube-title,
  .article-youtube-card .youtube-title a{
    font-size:24px !important;
    line-height:1.18 !important;
  }

  .card p,
  .article-youtube-card .article-youtube-excerpt{
    font-size:15.5px !important;
    line-height:1.68 !important;
  }
}

@media(max-width:760px){
  .single .content-area,
  .page .content-area{
    padding-left:24px !important;
    padding-right:24px !important;
  }

  .content-area p,
  .content-area li{
    font-size:17px !important;
    line-height:1.78 !important;
  }
}

/* ==================================================
   V16.5 - ARTICOLI PIÙ LEGGIBILI + LINK/GRASSETTI GIALLI + INFO ARTICOLO
   ================================================== */

/* Grassetti gialli dentro gli articoli */
.single-post .content-area strong,
.single-post .content-area b,
.single .content-area strong,
.single .content-area b,
.entry-content strong,
.entry-content b{
  color:var(--yellow,#ffff00) !important;
  font-weight:900 !important;
  text-shadow:0 0 12px rgba(255,255,0,.18) !important;
}

/* Link gialli e più visibili negli articoli */
.single-post .content-area a,
.single .content-area a,
.entry-content a{
  color:var(--yellow,#ffff00) !important;
  font-weight:800 !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,0,.55) !important;
  box-shadow:inset 0 -0.12em 0 rgba(255,255,0,.12) !important;
  transition:color .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.single-post .content-area a:hover,
.single .content-area a:hover,
.entry-content a:hover{
  border-bottom-color:var(--yellow,#ffff00) !important;
  box-shadow:inset 0 -0.45em 0 rgba(255,255,0,.18) !important;
}

/* Header articolo stile magazine-tech */
.single-post .content-area{
  max-width:1120px !important;
}

.single-post .entry-title{
  max-width:980px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  margin-bottom:26px !important;
  color:#ffffff !important;
  font-size:clamp(38px,5vw,76px) !important;
  line-height:1.04 !important;
  letter-spacing:-.075em !important;
  text-align:center !important;
  text-shadow:none !important;
}

/* Meta info articolo: data, autore, categoria ecc. */
.single-post .entry-meta,
.single-post .post-meta,
.single-post .article-meta,
.single-post .posted-on,
.single-post .byline{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-items:center !important;
  gap:10px 14px !important;
  max-width:980px !important;
  margin:0 auto 32px !important;
  color:#dcdcdc !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

.single-post .entry-meta a,
.single-post .post-meta a,
.single-post .article-meta a,
.single-post .posted-on a,
.single-post .byline a{
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:999px !important;
  padding:8px 12px !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.035) !important;
}

.single-post .entry-meta a:hover,
.single-post .post-meta a:hover,
.single-post .article-meta a:hover,
.single-post .posted-on a:hover,
.single-post .byline a:hover{
  color:#000000 !important;
  background:var(--yellow,#ffff00) !important;
  border-color:var(--yellow,#ffff00) !important;
}

/* Badge categoria/data se il tema usa classi WordPress comuni */
.single-post .cat-links a,
.single-post .tags-links a{
  color:#000000 !important;
  background:var(--yellow,#ffff00) !important;
  border:1px solid var(--yellow,#ffff00) !important;
  border-radius:999px !important;
  padding:8px 12px !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  box-shadow:0 0 18px rgba(255,255,0,.16) !important;
}

/* Box info articolo automatico se esiste un blocco meta/summary */
.single-post .entry-summary,
.single-post .article-summary,
.single-post .post-summary,
.single-post .excerpt,
.single-post .lead{
  max-width:880px !important;
  margin:0 auto 46px !important;
  color:#dcdcdc !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-size:clamp(18px,2vw,24px) !important;
  font-weight:600 !important;
  line-height:1.65 !important;
  letter-spacing:-.035em !important;
  text-align:center !important;
}

/* Immagine in evidenza articolo */
.single-post .post-thumbnail,
.single-post .entry-thumbnail,
.single-post .featured-image{
  max-width:1180px !important;
  margin:44px auto 54px !important;
  border-radius:28px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 0 34px rgba(255,255,0,.08) !important;
}

.single-post .post-thumbnail img,
.single-post .entry-thumbnail img,
.single-post .featured-image img{
  display:block !important;
  width:100% !important;
  height:auto !important;
}

/* Corpo articolo in card leggibile */
.single-post .entry-content{
  max-width:860px !important;
  margin:0 auto !important;
  padding:0 !important;
}

.single-post .entry-content p,
.single-post .entry-content li{
  color:#e9e9e9 !important;
  font-size:19px !important;
  line-height:1.9 !important;
  letter-spacing:-.028em !important;
}

.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4{
  color:var(--yellow,#ffff00) !important;
  font-family:var(--font-title,'JetBrains Mono',monospace) !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  letter-spacing:-.055em !important;
  text-transform:none !important;
}

.single-post .entry-content h2{
  font-size:clamp(30px,3vw,46px) !important;
  margin-top:64px !important;
}

.single-post .entry-content h3{
  font-size:clamp(24px,2.3vw,34px) !important;
  margin-top:46px !important;
}

/* Citazioni/box evidenziati */
.single-post blockquote,
.entry-content blockquote{
  margin:44px 0 !important;
  padding:28px 30px !important;
  background:#070707 !important;
  border-left:5px solid var(--yellow,#ffff00) !important;
  border-radius:0 22px 22px 0 !important;
  color:#ffffff !important;
  box-shadow:0 0 26px rgba(255,255,0,.08) !important;
}

.single-post blockquote p,
.entry-content blockquote p{
  margin:0 !important;
  color:#ffffff !important;
  font-size:21px !important;
  font-weight:700 !important;
  line-height:1.65 !important;
}

/* Codice dentro gli articoli, stile editor */
.single-post code,
.entry-content code{
  color:#000000 !important;
  background:var(--yellow,#ffff00) !important;
  border-radius:8px !important;
  padding:.12em .36em !important;
  font-family:var(--font-code,'JetBrains Mono',monospace) !important;
  font-weight:800 !important;
}

.single-post pre,
.entry-content pre{
  background:#050505 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:22px !important;
  padding:24px !important;
  overflow:auto !important;
  box-shadow:0 0 28px rgba(255,255,0,.08) !important;
}

.single-post pre code,
.entry-content pre code{
  background:transparent !important;
  color:var(--yellow,#ffff00) !important;
  padding:0 !important;
}

/* Navigazione articoli precedente/successivo */
.single-post .post-navigation,
.single-post .nav-links{
  max-width:980px !important;
  margin:70px auto 0 !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:18px !important;
}

.single-post .post-navigation a,
.single-post .nav-links a{
  display:block !important;
  padding:22px !important;
  background:#070707 !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:22px !important;
  color:#ffffff !important;
  box-shadow:none !important;
}

.single-post .post-navigation a:hover,
.single-post .nav-links a:hover{
  border-color:rgba(255,255,0,.7) !important;
  color:var(--yellow,#ffff00) !important;
  box-shadow:0 0 26px rgba(255,255,0,.10) !important;
}

@media(max-width:760px){
  .single-post .entry-title{
    text-align:left !important;
    font-size:40px !important;
    line-height:1.08 !important;
    letter-spacing:-.06em !important;
  }

  .single-post .entry-meta,
  .single-post .post-meta,
  .single-post .article-meta,
  .single-post .posted-on,
  .single-post .byline{
    justify-content:flex-start !important;
    font-size:11px !important;
    margin-bottom:26px !important;
  }

  .single-post .entry-summary,
  .single-post .article-summary,
  .single-post .post-summary,
  .single-post .excerpt,
  .single-post .lead{
    text-align:left !important;
    font-size:17px !important;
    line-height:1.65 !important;
  }

  .single-post .entry-content p,
  .single-post .entry-content li{
    font-size:17px !important;
    line-height:1.82 !important;
  }

  .single-post .post-navigation,
  .single-post .nav-links{
    grid-template-columns:1fr !important;
  }
}

/* ==================================================
   V16.6 - SINGLE ARTICLE PREMIUM + META INFO + RELATED
   ================================================== */
.single-article-main{
  max-width:none !important;
  padding:calc(var(--header-height) + 70px) 36px 80px !important;
}

.single-article{
  max-width:1180px !important;
  margin:0 auto !important;
}

.single-article-hero{
  text-align:center !important;
  padding:34px 0 54px !important;
}

.single-article-meta-top{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:12px !important;
  flex-wrap:wrap !important;
  margin-bottom:28px !important;
}

.single-pill{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  padding:8px 14px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:999px !important;
  background:#070707 !important;
  color:#ffffff !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}

.single-author{
  background:var(--yellow,#ffff00) !important;
  border-color:var(--yellow,#ffff00) !important;
  color:#000000 !important;
}

.single-title{
  max-width:980px !important;
  margin:0 auto 26px !important;
  color:#ffffff !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:clamp(42px,5.2vw,78px) !important;
  font-weight:900 !important;
  line-height:1.05 !important;
  letter-spacing:-.07em !important;
  text-transform:none !important;
  text-shadow:none !important;
}

.single-excerpt{
  max-width:900px !important;
  margin:0 auto !important;
  color:#d8d8d8 !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:clamp(18px,1.6vw,24px) !important;
  font-weight:600 !important;
  line-height:1.55 !important;
}

.single-featured-image{
  margin:0 auto 58px !important;
  max-width:1180px !important;
  border-radius:30px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:#070707 !important;
  box-shadow:0 0 42px rgba(255,255,0,.10) !important;
}

.single-featured-image img{
  width:100% !important;
  height:auto !important;
  display:block !important;
}

.single-content-wrap{
  display:grid !important;
  grid-template-columns:260px minmax(0,760px) !important;
  justify-content:center !important;
  gap:56px !important;
  align-items:start !important;
}

.single-info-card{
  position:sticky !important;
  top:calc(var(--header-height) + 28px) !important;
  background:#070707 !important;
  border:1px solid rgba(255,255,255,.11) !important;
  border-radius:24px !important;
  padding:22px !important;
  box-shadow:0 0 28px rgba(255,255,0,.06) !important;
}

.single-info-title{
  color:var(--yellow,#ffff00) !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:15px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.08em !important;
  margin-bottom:18px !important;
}

.single-info-card dl,
.single-info-card dt,
.single-info-card dd{
  margin:0 !important;
}

.single-info-card dl{
  display:grid !important;
  gap:16px !important;
}

.single-info-card dt{
  color:#9e9e9e !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:11px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.1em !important;
  margin-bottom:4px !important;
}

.single-info-card dd,
.single-info-card dd a{
  color:#ffffff !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.45 !important;
}

.single-info-card dd a:hover{
  color:var(--yellow,#ffff00) !important;
}

.single-content{
  min-width:0 !important;
}

.single-content p,
.single-content li{
  color:#eeeeee !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:20px !important;
  line-height:1.9 !important;
  letter-spacing:-.02em !important;
}

.single-content p{
  margin:0 0 30px !important;
}

.single-content strong,
.single-content b,
.single-content a,
.single-content li strong,
.single-content li b{
  color:var(--yellow,#ffff00) !important;
}

.single-content a{
  font-weight:800 !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,0,.55) !important;
}

.single-content a:hover{
  border-bottom-color:var(--yellow,#ffff00) !important;
  text-shadow:0 0 16px rgba(255,255,0,.28) !important;
}

.single-content h2,
.single-content h3,
.single-content h4{
  color:var(--yellow,#ffff00) !important;
  font-family:'JetBrains Mono', monospace !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  letter-spacing:-.04em !important;
  text-transform:none !important;
  margin:56px 0 20px !important;
}

.single-content h2{font-size:clamp(30px,3vw,44px) !important;}
.single-content h3{font-size:clamp(25px,2.4vw,34px) !important;}
.single-content h4{font-size:24px !important;}

.single-content blockquote{
  margin:42px 0 !important;
  padding:26px 30px !important;
  border-left:4px solid var(--yellow,#ffff00) !important;
  border-radius:0 22px 22px 0 !important;
  background:#070707 !important;
  color:#ffffff !important;
}

.single-content blockquote p{
  margin:0 !important;
  color:#ffffff !important;
  font-size:22px !important;
  font-weight:700 !important;
}

.single-content code,
.single-content pre{
  font-family:'JetBrains Mono', monospace !important;
}

.single-content code{
  background:#111 !important;
  color:var(--yellow,#ffff00) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:8px !important;
  padding:.12em .36em !important;
}

.single-content pre{
  background:#070707 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:22px !important;
  padding:22px !important;
  overflow:auto !important;
}

.single-article-footer{
  max-width:760px !important;
  margin:54px auto 0 !important;
}

.single-tags{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  margin-bottom:34px !important;
}

.single-tags span{
  color:#9e9e9e !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:13px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.single-tags a{
  display:inline-flex !important;
  padding:8px 12px !important;
  border-radius:999px !important;
  background:#070707 !important;
  border:1px solid rgba(255,255,0,.35) !important;
  color:var(--yellow,#ffff00) !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:13px !important;
  font-weight:800 !important;
  text-decoration:none !important;
}

.single-share-box{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:24px !important;
  background:#070707 !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:26px !important;
  padding:26px !important;
  box-shadow:0 0 28px rgba(255,255,0,.06) !important;
}

.single-share-box strong{
  color:var(--yellow,#ffff00) !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:20px !important;
}

.single-share-box p{
  margin:8px 0 0 !important;
  color:#d6d6d6 !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:15px !important;
  line-height:1.5 !important;
}

.single-share-button{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  background:var(--yellow,#ffff00) !important;
  color:#000000 !important;
  padding:14px 22px !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:14px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
}

.single-post-nav{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:18px !important;
  margin-top:28px !important;
}

.single-post-nav a{
  display:block !important;
  background:#070707 !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:20px !important;
  padding:18px !important;
  color:#ffffff !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1.45 !important;
  text-decoration:none !important;
}

.single-post-nav a:hover{
  color:var(--yellow,#ffff00) !important;
  border-color:rgba(255,255,0,.55) !important;
}

.single-next{text-align:right !important;}

.related-articles-section{
  max-width:1180px !important;
  margin:86px auto 0 !important;
  padding-top:58px !important;
  border-top:1px solid rgba(255,255,255,.12) !important;
}

.related-articles-grid{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:28px !important;
}

.related-article-card{
  background:#070707 !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-radius:26px !important;
  overflow:hidden !important;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

.related-article-card:hover{
  transform:translateY(-5px) !important;
  border-color:rgba(255,255,0,.62) !important;
  box-shadow:0 0 28px rgba(255,255,0,.10) !important;
}

.related-thumb{
  display:block !important;
  aspect-ratio:16/9 !important;
  overflow:hidden !important;
  background:#000 !important;
  color:var(--yellow,#ffff00) !important;
  text-decoration:none !important;
}

.related-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  transition:transform .35s ease !important;
}

.related-thumb span{
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:42px !important;
  font-weight:900 !important;
}

.related-article-card:hover .related-thumb img{
  transform:scale(1.04) !important;
}

.related-body{
  padding:22px !important;
}

.related-date{
  color:var(--yellow,#ffff00) !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  margin-bottom:12px !important;
}

.related-body h3{
  margin:0 0 14px !important;
  line-height:1.25 !important;
}

.related-body h3 a{
  color:#ffffff !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:20px !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
  text-decoration:none !important;
}

.related-body h3 a:hover{
  color:var(--yellow,#ffff00) !important;
}

.related-body p{
  color:#cfcfcf !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:15px !important;
  line-height:1.65 !important;
  margin:0 !important;
}

@media(max-width:1020px){
  .single-content-wrap{
    grid-template-columns:1fr !important;
    gap:34px !important;
    max-width:820px !important;
    margin:0 auto !important;
  }
  .single-info-card{
    position:relative !important;
    top:auto !important;
  }
  .single-info-card dl{
    grid-template-columns:repeat(2,1fr) !important;
  }
  .related-articles-grid{
    grid-template-columns:1fr 1fr !important;
  }
}

@media(max-width:760px){
  .single-article-main{
    padding:calc(var(--header-height-mobile) + 34px) 22px 58px !important;
  }
  .single-article-hero{
    text-align:left !important;
    padding:20px 0 34px !important;
  }
  .single-article-meta-top{
    justify-content:flex-start !important;
    gap:8px !important;
    margin-bottom:20px !important;
  }
  .single-pill{
    min-height:30px !important;
    padding:7px 10px !important;
    font-size:11px !important;
  }
  .single-title{
    font-size:38px !important;
    letter-spacing:-.06em !important;
    line-height:1.05 !important;
  }
  .single-excerpt{
    font-size:17px !important;
  }
  .single-featured-image{
    margin-bottom:34px !important;
    border-radius:22px !important;
  }
  .single-info-card dl{
    grid-template-columns:1fr !important;
  }
  .single-content p,
  .single-content li{
    font-size:17px !important;
    line-height:1.85 !important;
  }
  .single-share-box{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
  .single-share-button{
    width:100% !important;
  }
  .single-post-nav{
    grid-template-columns:1fr !important;
  }
  .single-next{text-align:left !important;}
  .related-articles-section{
    margin-top:56px !important;
    padding-top:42px !important;
  }
  .related-articles-grid{
    grid-template-columns:1fr !important;
  }
}


/* ==================================================
   V16.7 - PULIZIA ARTICOLO: NO INFO BOX / NO CTA SHARE
   ================================================== */
.single-content-wrap{
  display:block !important;
  max-width:820px !important;
  margin:0 auto !important;
}

.single-info-card,
.single-share-box,
.article-end-cta{
  display:none !important;
}

.single-article-footer{
  max-width:820px !important;
}

.single-article-meta-top .single-author{
  font-weight:900 !important;
}

/* ==================================================
   V16.8 - SOLO ARTICOLI CORRELATI + CAROSELLO MOBILE
   ================================================== */
.single-post-nav{
  display:none !important;
}

.related-articles-section .section-title::after{
  content:" ultimi 3";
  color:#ffffff;
  opacity:.45;
  font-size:.55em;
  font-weight:700;
  margin-left:12px;
  letter-spacing:0;
  text-transform:none;
}

@media(max-width:760px){
  .related-articles-section{
    overflow:hidden !important;
    margin-left:-22px !important;
    margin-right:-22px !important;
    padding-left:22px !important;
    padding-right:0 !important;
  }

  .related-articles-section .section-title{
    padding-right:22px !important;
  }

  .related-articles-grid{
    display:flex !important;
    grid-template-columns:none !important;
    overflow-x:auto !important;
    gap:18px !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding-left:22px !important;
    -webkit-overflow-scrolling:touch !important;
    padding:0 22px 22px 0 !important;
    margin:0 !important;
    scrollbar-width:none !important;
  }

  .related-articles-grid::-webkit-scrollbar{
    display:none !important;
  }

  .related-article-card{
    flex:0 0 84% !important;
    width:84% !important;
    min-width:84% !important;
    max-width:84% !important;
    scroll-snap-align:start !important;
  }
}




/* ==================================================
   HERO FADE CLEAN CINEMATIC
   ================================================== */

.hero{
  position:relative;
  overflow:hidden;
}

.hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:180px;
  background:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.35) 55%,
    rgba(0,0,0,.82) 82%,
    #000000 100%
  );
  pointer-events:none;
  z-index:1;
}

.hero-content{
  position:relative;
  z-index:2;
}

.youtube-section{
  position:relative;
  z-index:3;
  margin-top:0 !important;
  border-top:none !important;
}


/* ==================================================
   V19 - RIMOZIONE LINEE DIVISORIE TRA SEZIONI
   ================================================== */

/* Toglie le linee orizzontali che spezzano il layout */
.hero,
.youtube-section,
.about-section,
.about-section.chicco-about-v16,
.contact-section,
.site-footer,
.chicco-footer,
.chicco-copyright-bar,
.content-area,
.site-main,
.articles-youtube-section{
  border-top:none !important;
  border-bottom:none !important;
}

/* Toglie eventuali bordi generati da sezioni interne */
.hero::before,
.youtube-section::before,
.youtube-section::after,
.site-main::before,
.site-main::after,
.articles-youtube-section::before,
.articles-youtube-section::after{
  border:none !important;
  background:none !important;
}

/* Mantiene la sfumatura hero ma senza creare tagli o linee */
.hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:180px;
  background:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.28) 50%,
    rgba(0,0,0,.75) 82%,
    #000000 100%
  ) !important;
  pointer-events:none;
  z-index:1;
  border:none !important;
}

/* Evita tagli tra hero e video */
.youtube-section{
  margin-top:0 !important;
  padding-top:72px !important;
}

/* ==================================================
   V20 - HERO SUPER CINEMATIC FADE
   ================================================== */

.hero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:340px;
  background:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.08) 18%,
    rgba(0,0,0,.22) 38%,
    rgba(0,0,0,.52) 68%,
    rgba(0,0,0,.82) 88%,
    #000000 100%
  ) !important;
  pointer-events:none;
  z-index:1;
  border:none !important;
}


/* ==================================================
   V21 - TITLE SIZE CONTROL
   ================================================== */

:root{

  /* HOMEPAGE */
  --home-card-title-size:52px;
  --home-card-title-mobile:24px;

  /* SINGLE ARTICLE */
  --single-title-size:78px;
  --single-title-mobile:34px;

}

/* Homepage article cards */
.card h2{
  font-size:var(--home-card-title-size) !important;
}

/* Single article title */
.single-post h1,
.post-title,
.entry-title{
  font-size:var(--single-title-size) !important;
  line-height:.95;
  letter-spacing:-0.06em;
}

/* Mobile optimization */
@media(max-width:768px){

  .card h2{
    font-size:var(--home-card-title-mobile) !important;
    line-height:1.12 !important;
  }

  .single-post h1,
  .post-title,
  .entry-title{
    font-size:var(--single-title-mobile) !important;
    line-height:1.02 !important;
    letter-spacing:-0.04em !important;
  }

}


/* ==================================================
   V23 - CUSTOMIZER TITLE SIZE FIX
   Ora le dimensioni si modificano da:
   Personalizza > Chicco Tech - Articoli YouTube Style
   ================================================== */

.article-youtube-card .youtube-title,
.article-youtube-card .youtube-title a,
.card h2,
.card h2 a{
  font-size:var(--home-card-title-size) !important;
}

.single-post .entry-title,
.single .entry-title,
.single-post h1.entry-title,
.single h1.entry-title{
  font-size:var(--single-title-size) !important;
  line-height:.98 !important;
  letter-spacing:-0.055em !important;
}

@media(max-width:768px){
  .article-youtube-card .youtube-title,
  .article-youtube-card .youtube-title a,
  .card h2,
  .card h2 a{
    font-size:var(--home-card-title-mobile) !important;
    line-height:1.16 !important;
    letter-spacing:-0.035em !important;
  }

  .single-post .entry-title,
  .single .entry-title,
  .single-post h1.entry-title,
  .single h1.entry-title{
    font-size:var(--single-title-mobile) !important;
    line-height:1.08 !important;
    letter-spacing:-0.04em !important;
  }
}
