/* =========================================================================
   Skin INSIDER — clone del layout di insider.sm.
   Apertura a 3 colonne: banner+lista | grande slider centrale | banner+lista.
   Attiva su body.kn-style-insider.
   ========================================================================= */

body.kn-style-insider{
	--kn-serif:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.kn-style-insider h1,.kn-style-insider h2,.kn-style-insider h3,.kn-style-insider h4,
.kn-style-insider .site-title,.kn-style-insider .section-title span{letter-spacing:-.02em;font-weight:800}

/* Masthead + nav centrati come insider */
.kn-style-insider .masthead__inner{position:relative;justify-content:center;text-align:center}
.kn-style-insider .masthead__brand{align-items:center}
.kn-style-insider .site-title{font-weight:900;letter-spacing:-.03em}
.kn-style-insider .masthead__tools{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.kn-style-insider .mainnav__inner{justify-content:center}
.kn-style-insider .section-title{justify-content:center;text-align:center}
.kn-style-insider .section-title span::after{left:50%;transform:translateX(-50%);width:64px}

/* Titolina "— In evidenza —" con filetti */
.ins-eyebrow{display:flex;align-items:center;gap:14px;margin:0 0 16px}
.ins-eyebrow > a,.ins-eyebrow > span{display:contents}
.ins-eyebrow span{font-family:var(--kn-serif);font-weight:800;color:var(--kn-primary);font-size:18px;white-space:nowrap}
.ins-eyebrow::before,.ins-eyebrow::after{content:"";height:1px;background:var(--kn-line-strong);flex:1}
.ins-eyebrow--center span{font-size:22px}

/* Griglia 3 colonne */
.opening-insider{margin-top:clamp(16px,2.4vw,26px)}
.ins-grid{display:grid;grid-template-columns:260px minmax(0,1fr) 260px;gap:clamp(18px,2.4vw,32px);align-items:start}
.ins-block{margin-bottom:26px}
.ins-block:last-child{margin-bottom:0}

/* Banner nelle colonne */
.ins-ad{text-align:center}
.ins-ad__inner img{width:100%;height:auto;border-radius:6px}

/* Slider centrale grande */
.ins-slider{aspect-ratio:1/1;border-radius:12px}
.ins-slider .hero__slide-body{inset:0;display:flex;align-items:center;padding:clamp(22px,3vw,40px)}
.ins-slider .hero__slide-panel{max-width:88%}
.ins-slider .hero__scrim{background:
	linear-gradient(90deg,rgba(8,9,14,.85) 0%,rgba(8,9,14,.45) 55%,rgba(8,9,14,.12) 100%),
	linear-gradient(rgba(8,9,14,.18),rgba(8,9,14,.18))}
.ins-slider .hero__slide-title{font-size:clamp(24px,2.6vw,38px);margin:12px 0 18px}
.ins-slider .hero__nav{opacity:1;background:rgba(12,13,18,.5)}
.ins-slider .hero__dots{left:50%;transform:translateX(-50%);bottom:16px}
.ins-more{display:inline-block;background:var(--kn-primary);color:#fff;font-family:var(--kn-sans);font-weight:700;padding:11px 24px;border-radius:6px;transition:.15s}
.ins-more:hover{background:var(--kn-primary-dark);color:#fff}

/* Liste laterali */
.ins-list{display:flex;flex-direction:column}
.ins-item{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--kn-line)}
.ins-item:last-child{border-bottom:0}
.ins-item__media{border-radius:6px;overflow:hidden;aspect-ratio:1/1}
.ins-item__media img,.ins-item__media .thumb-fallback{width:100%;height:100%;object-fit:cover}
.ins-item__title{font-size:14.5px;line-height:1.28;margin:0;font-weight:700}
.ins-item__title a{color:var(--kn-ink)}
.ins-item__title a:hover{color:var(--kn-primary)}

/* Sotto l'apertura la home torna a piena larghezza (niente aside doppione) */
.kn-style-insider .home-columns{grid-template-columns:1fr}
.kn-style-insider .home-aside{display:none}

@media(max-width:1024px){
	.ins-grid{grid-template-columns:1fr 1fr;grid-template-areas:"center center" "left right"}
	.ins-center{grid-area:center}
	.ins-col--left{grid-area:left}
	.ins-col--right{grid-area:right}
	.ins-slider{aspect-ratio:16/10}
}
@media(max-width:640px){
	.ins-grid{grid-template-columns:1fr;grid-template-areas:"center" "left" "right"}
	.ins-slider{aspect-ratio:4/3}
}
