/* ============================================================
   CAPIRE LA DEMENZA — stili della sezione informativa
   Associazione Alzheimer Udine ODV
   Dipende dai token di design in assets/site.css
   ============================================================ */



/* padding uniforme per tutti i blocchi (card, riquadri, pannelli) */
:root{--cap-pad:22px 24px;--cap-gap:20px;}
@media(max-width:560px){:root{--cap-pad:18px 18px;--cap-gap:16px;}}

/* ---------- card ---------- */
.cap-grid{display:grid;gap:var(--cap-gap);grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));}
.cap-grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));}

.cap-card{
  position:relative;display:flex;flex-direction:column;gap:10px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--cap-pad);box-shadow:var(--shadow);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.cap-card:hover{transform:translateY(-3px);border-color:var(--teal);}
.cap-card h3{font-size:var(--step-1);line-height:1.3;margin:0;overflow-wrap:anywhere;}
.cap-card p{margin:0;color:var(--ink-soft);font-size:0.98rem;line-height:1.6;}

/* card interamente cliccabile (stesso schema delle card news) */
.cap-card-link{color:var(--teal-deep);text-decoration:none;}
.cap-card-link::after{content:"";position:absolute;inset:0;border-radius:var(--radius);}
.cap-card-link:focus-visible{outline:none;}
.cap-card-link:focus-visible::after{outline:3px solid var(--amber);outline-offset:2px;}

.cap-card-cta{margin-top:auto;padding-top:6px;font-weight:700;color:var(--teal);font-size:0.95rem;}
.cap-num{font-weight:800;font-size:0.9rem;letter-spacing:.06em;color:var(--amber);}
.cap-tool{background:var(--teal-tint);}

/* ---------- pagina scheda ---------- */
.cap-article ul,.cap-article ol{padding-left:1.3em;margin:0 0 1.3em;}
.cap-article li{margin-bottom:.5em;line-height:1.65;font-size:1rem;}
.cap-article h2{font-size:var(--step-2);overflow-wrap:anywhere;}


.cap-src{font-size:0.9rem;color:var(--ink-soft);margin-top:1.4em;}


.cap-note{
  font-size:0.92rem !important;color:var(--ink-soft);background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:var(--cap-pad);margin:28px 0 !important;line-height:1.6 !important;
}

.cap-pn{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 0;}
.cap-pn a{
  display:flex;flex-direction:column;gap:4px;text-decoration:none;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:var(--cap-pad);min-height:64px;color:var(--teal-deep);
}
.cap-pn a:hover{border-color:var(--teal);background:var(--teal-tint);}
.cap-pn small{color:var(--ink-soft);font-weight:600;}
.cap-pn span{font-weight:700;line-height:1.35;overflow-wrap:anywhere;}
.cap-pn-next{text-align:right;}
@media(max-width:560px){.cap-pn{grid-template-columns:1fr;}.cap-pn-next{text-align:left;}}

/* ---------- strumento domande e risposte ---------- */
.qa-progress{font-weight:700;color:var(--teal-deep);}
.qa-list{list-style:none;padding:0;margin:0 0 20px;}
.qa-item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--cap-pad);box-shadow:var(--shadow);}
.qa-q{font-size:var(--step-2);line-height:1.3;margin:0 0 4px;overflow-wrap:break-word;hyphens:auto;}
.qa-a{margin-top:18px;padding-top:18px;border-top:1px dashed var(--line);}
.qa-a p,.qa-a li{font-size:1rem;line-height:1.65;}
.qa-actions{display:flex;gap:12px;flex-wrap:wrap;}
.qa-actions .btn{min-height:52px;}

/* ---------- pagina post Facebook ---------- */
.fb-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));margin-top:24px;}
.fb-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:var(--cap-pad);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px;}
.fb-card img{width:100%;height:auto;border-radius:var(--radius-sm);border:1px solid var(--line);}
.fb-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-weight:700;font-size:0.9rem;}
.fb-week{color:var(--amber);}
.fb-tag{color:var(--ink-soft);}
.fb-label{font-weight:700;font-size:0.9rem;color:var(--teal-deep);}
.fb-card textarea{width:100%;font:inherit;font-size:0.95rem;line-height:1.5;border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px;background:var(--paper);color:var(--ink);resize:vertical;}
.fb-actions{display:flex;gap:10px;flex-wrap:wrap;}
.fb-actions .btn{min-height:48px;padding:10px 16px;font-size:0.95rem;}
.fb-status{min-height:1.4em;margin:0;font-weight:700;color:#1f6b45;font-size:0.9rem;}

/* ---------- banda in home ---------- */
.capire-band{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.capire-band .cap-grid{margin-bottom:28px;}
.capire-band-actions{display:flex;gap:12px;flex-wrap:wrap;}

@media(max-width:560px){
}
@media(prefers-reduced-motion:reduce){.cap-card{transition:none;}.cap-card:hover{transform:none;}}

/* titoli lunghi (es. "psichico-comportamentali") senza spezzarsi a metà parola */
.page-hero h1,.article-hero h1{max-width:26ch;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;}
.cap-card h3{hyphens:auto;-webkit-hyphens:auto;}

/* ---------- fascia finale a tutta larghezza ---------- */
.cap-cta{padding:44px 0;}
.cap-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.cap-cta h2{margin:0 0 8px;}
.cap-cta p{margin:0;max-width:62ch;color:#F1E9F6;}
.cap-cta-actions{display:flex;gap:12px;flex-wrap:wrap;}
.cap-cta .btn-ghost{color:#fff;border-color:#fff;}
.cap-cta .btn-ghost:hover{background:rgba(255,255,255,.12);}
@media(max-width:560px){.cap-cta{padding:44px 0;}.cap-cta-actions .btn{width:100%;justify-content:center;}}

/* testo grande a 320px: nessun contenuto oltre il bordo */
.cap-article p,.cap-article li,.qa-a p,.qa-a li{overflow-wrap:anywhere;}
.cap-cta-inner>div{min-width:0;}
.cap-cta h2,.cap-cta p{overflow-wrap:anywhere;}
