/* Il Sentiero Zen — foglio di stile del sito */
:root{
  --nero:#0B0E13; --grigio-scuro:#23272C; --grigio-scheda:#353A40;
  --chiaro:#E9E7E3; --carta:#F5F4F1; --testo:#1C1F23; --testo-2:#4A4742; --testo-3:#55524D;
  --linea:#CFCCC6; --arancio:#E07A1F; --arancio-scuro:#A84A0C; --arancio-scuro-2:#7E3606; --arancio-chiaro:#F0A060;
  --su-scuro:#ECEAE6; --su-scuro-2:#B9B5AE;
  --serif:'Shippori Mincho',Georgia,serif; --sans:'Zen Kaku Gothic New',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--chiaro);color:var(--testo);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--arancio-scuro)}a:hover{color:var(--arancio-scuro-2)}
.contenitore{max-width:1200px;margin:0 auto;padding:0 24px}
.salta{position:absolute;left:-9999px}.salta:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:10}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.2}
.etichetta{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--arancio-scuro);font-weight:700}
.pulsante{display:inline-flex;align-items:center;min-height:48px;padding:0 26px;border-radius:999px;font-weight:700;text-decoration:none;background:var(--arancio);color:var(--nero)}
.pulsante:hover{background:var(--arancio-chiaro);color:var(--nero)}
.pulsante.contorno{background:transparent;border:1px solid #6E6A64;color:var(--su-scuro);font-weight:500}
.pulsante.contorno:hover{border-color:var(--su-scuro);color:#fff}

/* intestazione */
.testata{position:relative;z-index:2}
.testata .contenitore{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:20px;padding-bottom:20px}
.marchio{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.marchio-logo{position:relative;width:52px;height:52px;flex:none}
.marchio-logo img{width:52px;height:52px;border-radius:50%;background:#FDFDFD}
.marchio-logo .enso{position:absolute;inset:-4px;border-radius:50%;border:1px dashed rgba(224,122,31,.55);animation:zsEnso 40s linear infinite}
.marchio span{font-family:var(--serif);font-size:22px;font-weight:700;letter-spacing:.02em}
.menu{display:flex;flex-wrap:wrap;align-items:center;gap:24px;font-size:15px}
.menu a{text-decoration:none}
.menu .pulsante{min-height:44px;padding:0 20px}
.testata.scura{background:var(--nero);color:var(--su-scuro)}
.testata.scura .menu a:not(.pulsante){color:#D4D1CB}
.testata.scura .menu a:not(.pulsante):hover{color:#fff}

/* apertura */
.apertura{background:var(--nero);color:var(--su-scuro);overflow:hidden}
.apertura-corpo{display:flex;flex-wrap:wrap;gap:32px;align-items:center;padding-top:16px}
.apertura-testo{flex:999 1 480px;min-width:0;padding:40px 0 72px}
.apertura-testo .etichetta{color:var(--arancio);font-size:14px;letter-spacing:.16em}
.apertura h1{margin:16px 0 24px;font-size:clamp(40px,6vw,64px);line-height:1.12;color:#F3F1ED}
.apertura p{margin:0 0 32px;max-width:540px;font-size:19px;color:#BDB9B2}
.pulsanti{display:flex;flex-wrap:wrap;gap:14px}
.apertura-figura{flex:1 1 320px;min-width:0;align-self:flex-end;display:flex;justify-content:center;position:relative}
.apertura-figura .alone{position:absolute;left:50%;top:42%;width:120%;max-width:560px;aspect-ratio:1/1;transform:translate(-50%,-42%);border-radius:50%;background:radial-gradient(circle,rgba(224,122,31,.45) 0%,rgba(224,122,31,.12) 40%,rgba(11,14,19,0) 70%);animation:zsRespiro 9s ease-in-out infinite}
.apertura-figura img{position:relative;width:100%;max-width:440px;-webkit-mask-image:radial-gradient(ellipse 62% 72% at 50% 46%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 62% 72% at 50% 46%,#000 62%,transparent 100%);animation:zsSorge 1.8s cubic-bezier(.2,.7,.2,1) .2s both}
.entra-1{animation:zsEntra 1s ease-out .1s both}.entra-2{animation:zsEntra 1s ease-out .35s both}.entra-3{animation:zsEntra 1s ease-out .6s both}.entra-4{animation:zsEntra 1s ease-out .85s both}

.fascia{background:var(--grigio-scuro);color:var(--su-scuro);border-top:3px solid var(--arancio)}
.fascia .contenitore{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;padding-top:32px;padding-bottom:32px}
.fascia strong{display:block;font-family:var(--serif);font-weight:500;font-size:34px;color:#F3F1ED}
.fascia span{font-size:14px;color:var(--su-scuro-2)}

/* fondo tono su tono */
.fondo{background-image:url(/risorse/fondo-tono.webp);background-size:cover;background-position:left bottom;background-repeat:no-repeat;background-attachment:fixed}

.sezione{padding:88px 0 40px}
.sezione-testa{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:36px}
.sezione-testa h2{margin:0;font-size:40px}
.sezione-intro{margin:-20px 0 36px;color:var(--testo-2);max-width:620px}

.avviso{margin:0 0 28px;padding:14px 20px;background:rgba(35,39,44,.92);color:var(--su-scuro);border-radius:4px;font-size:15px}
.avviso strong{color:var(--arancio-chiaro)}

.scheda{display:flex;flex-direction:column;text-decoration:none;color:var(--testo);background:rgba(245,244,241,.92);border-radius:4px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}
.scheda:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(11,14,19,.14);color:var(--testo)}
.scheda img{width:100%;aspect-ratio:16/9;object-fit:cover}
.scheda-testo{padding:16px 20px 22px;display:flex;flex-direction:column;gap:10px}
.scheda h3{margin:0;font-size:22px;line-height:1.3}
.scheda.grande{flex-direction:row;flex-wrap:wrap;margin-bottom:48px}
.scheda.grande img{flex:1 1 520px;min-width:0}
.scheda.grande .scheda-testo{flex:1 1 380px;min-width:0;justify-content:center;padding:28px 32px}
.scheda.grande h3{font-size:34px;line-height:1.2}
.scheda.grande p{margin:0;color:var(--testo-2)}
.leggi{font-size:15px;color:var(--arancio-scuro);font-weight:700}
.griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:32px}

.temi{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.tema{display:flex;flex-direction:column;gap:8px;padding:28px;border-top:3px solid var(--arancio);border-radius:4px;text-decoration:none;color:var(--testo);background:var(--carta);transition:transform .35s ease,box-shadow .35s ease}
.tema:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(11,14,19,.14);color:var(--testo)}
.tema strong{font-family:var(--serif);font-weight:500;font-size:24px}
.tema span{font-size:14px;color:var(--testo-3)}
.tema em{font-style:normal;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--arancio-scuro);font-weight:700}

/* pillole */
.pillole{background:var(--grigio-scuro);color:var(--su-scuro)}
.pillole .sezione{padding-bottom:88px}
.pillole .sezione-testa a{color:var(--arancio-chiaro)}
.griglia-short{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:20px}
.short{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--su-scuro);transition:transform .35s ease}
.short:hover{transform:translateY(-4px);color:#fff}
.short-img{position:relative;border-radius:4px;overflow:hidden;background:var(--grigio-scheda);aspect-ratio:9/16}
.short-img img{width:100%;height:100%;object-fit:cover}
.short-img svg{position:absolute;left:10px;bottom:10px}
.short .ep{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--arancio-chiaro);font-weight:700}
.short span:last-child{font-size:15px;line-height:1.4}
.articolo .griglia-short .short{color:var(--testo)}
.articolo .griglia-short .short .ep{color:var(--arancio-scuro)}

/* chi siamo */
.chi{background-color:#C9CBC2;background-image:url(/risorse/sentiero.webp);background-size:cover;background-position:left center;border-top:3px solid var(--arancio);animation:zsDeriva 50s ease-in-out infinite alternate}
.chi .contenitore{display:flex;justify-content:flex-end;padding-top:96px;padding-bottom:96px}
.chi-riquadro{flex:0 1 560px;background:rgba(243,241,237,.88);border-radius:4px;padding:40px}
.chi-riquadro img{width:72px;height:72px;border-radius:50%;margin-bottom:20px}
.chi-riquadro h2{margin:0 0 20px;font-size:40px;line-height:1.15}
.chi-riquadro p{margin:0 0 28px;color:#3A3733}

/* piede */
.piede{background:var(--nero);color:var(--su-scuro-2);font-size:14px}
.piede .contenitore{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:36px;padding-bottom:36px}
.piede nav{display:flex;flex-wrap:wrap;gap:24px}
.piede a{color:var(--arancio-chiaro)}

/* articolo */
.articolo{max-width:760px;margin:0 auto;padding:64px 24px 40px;font-size:18px;line-height:1.75}
.percorso{font-size:14px;color:var(--testo-3);margin-bottom:28px}
.articolo h1{margin:0 0 20px;font-size:clamp(32px,5vw,46px);line-height:1.15}
.sommario{margin:0 0 32px;font-size:21px;color:var(--testo-2);line-height:1.6}
.dati{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;color:var(--testo-3);padding-bottom:32px;border-bottom:1px solid var(--linea)}
.video{position:relative;margin:40px 0;border-radius:4px;overflow:hidden;aspect-ratio:16/9;background:var(--nero)}
.video button{all:unset;cursor:pointer;position:absolute;inset:0;display:block}
.video button img{width:100%;height:100%;object-fit:cover}
.video button span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(11,14,19,.35);color:#F3F1ED;font-size:15px}
.video button:focus-visible{outline:3px solid var(--arancio);outline-offset:-3px}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.articolo h2{margin:56px 0 16px;font-size:32px;line-height:1.25}
.articolo p{margin:0 0 20px}
.articolo figure{margin:32px 0}.articolo figure img{width:100%;border-radius:4px}
.articolo blockquote{margin:40px 0;padding:8px 0 8px 28px;border-left:3px solid var(--arancio);font-family:var(--serif);font-size:28px;line-height:1.45;color:var(--arancio-scuro-2)}
.articolo ol,.articolo ul{margin:0 0 20px;padding-left:24px}.articolo li{margin-bottom:10px}
.da-provare{margin:48px 0;padding:32px;background:rgba(221,218,212,.94);border-radius:4px;border-left:3px solid var(--arancio)}
.da-provare h2{margin:0 0 12px;font-size:24px}.da-provare p:last-child{margin:0}
.articolo hr{border:none;border-top:1px solid var(--linea);margin:48px 0}
.nota{font-size:15px;color:var(--testo-3)}
.iscriviti{max-width:760px;margin:0 auto;padding:0 24px 72px}
.iscriviti div{padding:40px;background:var(--grigio-scuro);color:var(--su-scuro);border-radius:4px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.iscriviti h2{margin:0 0 8px;font-size:28px}.iscriviti p{margin:0;color:var(--su-scuro-2);font-size:16px}
.correlati{border-top:1px solid var(--linea)}
.correlati .sezione{padding:72px 0 96px}

/* pagine semplici */
.pagina{max-width:760px;margin:0 auto;padding:64px 24px 96px}
.pagina h1{font-size:clamp(32px,5vw,46px);margin:0 0 20px}

@keyframes zsSorge{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes zsEntra{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes zsRespiro{0%,100%{opacity:.35;transform:translate(-50%,-42%) scale(.92)}50%{opacity:.7;transform:translate(-50%,-42%) scale(1.04)}}
@keyframes zsDeriva{from{background-size:100% auto;background-position:0% 70%}to{background-size:112% auto;background-position:10% 60%}}
@keyframes zsEnso{from{transform:rotate(0)}to{transform:rotate(360deg)}}

@media (max-width:800px){
  .fondo{background-attachment:scroll;background-size:auto 100%}
  .chi{animation:none;background-size:cover;background-position:12% center}
  .chi .contenitore{padding-top:56px;padding-bottom:56px}
  .chi-riquadro{padding:28px}
  .sezione{padding-top:64px}
  .sezione-testa h2,.chi-riquadro h2{font-size:32px}
  .scheda.grande h3{font-size:28px}
  .menu{gap:16px}
  .apertura-figura img{max-width:300px}
  .apertura-testo{padding-bottom:24px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}
