/* Pagine con layout "courses-details", "about-area" e "faq-area" - restyling solo CSS, testi e HTML invariati.
   Stessa linea grafica di pagine_corsi.css (titoli con barretta, elenchi a righe, schede con ombra). */

/* ---------- testo corrente ---------- */
.cc-content .courses-details-content p,.cc-content .about-content p{
  font-size:17px; line-height:1.75; color:#2c3e55; text-align:left !important; hyphens:auto; margin:0 0 16px;}
.cc-content .courses-details-content p b,.cc-content .courses-details-content p strong,.cc-content .about-content p strong{color:var(--navy-deep,#07294d);}
.cc-content .courses-details-content a:not(.main-btn),.cc-content .about-content a{color:var(--teal,#3792f9); text-underline-offset:3px;}
/* la larghezza del blocco resta quella della colonna; si limita solo la lunghezza delle righe di testo */
.cc-content .courses-details-content p,.cc-content .courses-details-content .courses-details-list{max-width:88ch;}
.cc-content .courses-details-content h2,.cc-content .courses-details-content h2.courses-title,.cc-content .courses-details-content .title{
  font-family:var(--font-head,inherit); font-weight:800; font-size:clamp(1.7rem,1.25rem + 1.6vw,2.5rem); line-height:1.12; letter-spacing:-.02em; color:var(--navy-deep,#07294d); margin:0 0 14px;}
.cc-content .courses-details-content h3,.cc-content .courses-details-content h4,.cc-content .courses-details-content h5,.cc-content .courses-details-content .sub-title{
  position:relative; margin:38px 0 14px; padding-left:16px; font-family:var(--font-head,inherit); font-weight:700; font-size:clamp(1.2rem,1.05rem + .6vw,1.55rem); line-height:1.25; color:var(--navy-deep,#07294d);}
.cc-content .courses-details-content h3::before,.cc-content .courses-details-content h4::before,.cc-content .courses-details-content h5::before,.cc-content .courses-details-content .sub-title::before{
  content:""; position:absolute; left:0; top:.12em; bottom:.12em; width:5px; height:auto; border-radius:4px; transform:none;
  background:linear-gradient(180deg,var(--teal,#3792f9),#27b8a7);}
/* elenchi a righe con icona */
.cc-content .courses-details-content .courses-details-list{list-style:none; margin:0 0 22px; padding:0; display:grid; gap:10px;}
.cc-content .courses-details-content .courses-details-list li{
  display:flex; align-items:flex-start; gap:14px; margin:0; padding:14px 18px; background:#f5f9ff; border:1px solid #e1ecfa; border-radius:14px;}
.cc-content .courses-details-content .courses-details-list li i{flex:0 0 auto; position:static; margin-top:3px; width:auto; font-size:18px; color:#27b8a7; line-height:1;}
.cc-content .courses-details-content .courses-details-list li p{margin:0; padding:0; font-size:16.5px; line-height:1.6; color:#2c3e55;}
.cc-content .courses-details-content .courses-details-list li:has(> i:only-child){display:none;}
.cc-content .courses-details-content .courses-details-list li:has(> i:only-child) + li::before{
  content:"\f058"; font-family:"Font Awesome 5 Pro"; font-weight:400; flex:0 0 auto; margin-top:3px; font-size:18px; color:#27b8a7; line-height:1;}
/* riquadro laterale (Info e costi) e riquadri evidenziati */
.cc-content .sidebar-box{border:1px solid #e3ebf5 !important; border-radius:20px !important; background:#fff !important; padding:24px !important; box-shadow:0 18px 36px -22px rgba(7,41,77,.45) !important;}
.cc-content .sidebar-box h5{font-family:var(--font-head,inherit); font-weight:700; font-size:20px; color:var(--navy-deep,#07294d) !important; margin:0 0 12px;}
.cc-content .sidebar-box .main-btn,.cc-content .courses-details .main-btn{
  display:inline-block; padding:13px 24px; border:0; border-radius:99px; background:var(--navy-deep,#07294d); color:#fff; font-weight:700; line-height:1.2; text-decoration:none; text-align:center; transition:background .2s, transform .2s;}
.cc-content .sidebar-box .main-btn.btn-block{display:block; width:100%; box-sizing:border-box;}
.cc-content .sidebar-box .main-btn:hover,.cc-content .courses-details .main-btn:hover{background:var(--teal,#3792f9); transform:translateY(-2px);}
.cc-content .courses-details-content .bg-light{background:#f5f9ff !important; border:1px solid #e1ecfa !important; border-radius:18px !important;}

/* ---------- Chi siamo / Pearson: blocco introduttivo ---------- */
.cc-content .about-content .about-title{font-family:var(--font-head,inherit); font-weight:800; font-size:clamp(1.9rem,1.25rem + 2.4vw,3rem); line-height:1.1; letter-spacing:-.02em; color:var(--navy-deep,#07294d); margin:0 0 18px;}
.cc-content .about-content .about-title span{color:var(--teal,#3792f9);}
.cc-content .about-area .about-content{max-width:80ch;}
.cc-content .about-content .main-btn{display:inline-block; padding:13px 28px; border:0; border-radius:99px; background:var(--navy-deep,#07294d); color:#fff; font-weight:700; text-decoration:none; transition:background .2s, transform .2s;}
.cc-content .about-content .main-btn:hover{background:var(--teal,#3792f9); transform:translateY(-2px);}

/* ---------- FAQ ---------- */
.cc-content .faq-area .section-title-2 .title{font-family:var(--font-head,inherit); font-weight:800; font-size:clamp(1.8rem,1.3rem + 1.8vw,2.7rem); line-height:1.12; letter-spacing:-.02em; color:var(--navy-deep,#07294d);}
.cc-content .faq-area .section-title-2 > p{margin-top:18px; padding:18px 22px; background:#f5f9ff; border:1px solid #e1ecfa; border-radius:16px; line-height:2; font-size:16px; max-width:80ch;}
.cc-content .faq-area .section-title-2 > p a{color:var(--navy-deep,#07294d); font-weight:600; text-decoration:none;}
.cc-content .faq-area .section-title-2 > p a:hover{color:var(--teal,#3792f9);}
.cc-content .faq-wrapper{max-width:90ch;}
.cc-content .faq-wrapper .accordion > h3.title{position:relative; margin:46px 0 16px; padding-left:16px; font-family:var(--font-head,inherit); font-weight:700; font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem); line-height:1.25; color:var(--navy-deep,#07294d);}
.cc-content .faq-wrapper .accordion > h3.title::before{content:""; position:absolute; left:0; top:.1em; bottom:.1em; width:5px; border-radius:4px; background:linear-gradient(180deg,var(--teal,#3792f9),#27b8a7);}
.cc-content .faq-wrapper .accordion .card{position:relative; margin:0 0 12px; padding:16px 20px 16px 58px; background:#fff; border:1px solid #e3ebf5; border-radius:16px; box-shadow:0 10px 24px -20px rgba(7,41,77,.5); overflow:hidden;}
.cc-content .faq-wrapper .accordion .card .question{position:absolute; left:18px; top:14px; width:30px; height:30px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:var(--navy-deep,#07294d); color:#fff; font-weight:700; font-size:14px; line-height:1; padding:0; margin:0;}
.cc-content .faq-wrapper .accordion .card .card-header{background:none; border:0; padding:3px 0;}
.cc-content .faq-wrapper .accordion .card .card-header a{font-family:var(--font-head,inherit); font-weight:700; font-size:17px; line-height:1.4; color:var(--navy-deep,#07294d); text-decoration:none;}
.cc-content .faq-wrapper .accordion .card .card-header a:hover{color:var(--teal,#3792f9);}
.cc-content .faq-wrapper .accordion .card .card-body{position:relative; padding:12px 0 2px;}
.cc-content .faq-wrapper .accordion .card .card-body .answer{position:absolute; left:-40px; top:12px; width:28px; height:28px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:#27b8a7; color:#fff; font-weight:700; font-size:14px; padding:0; margin:0;}
.cc-content .faq-wrapper .accordion .card .card-body p{font-size:16px; line-height:1.7; color:#2c3e55; margin:0 0 10px; text-align:left;}
.cc-content .faq-wrapper .accordion .card .card-body a{color:var(--teal,#3792f9);}

@media (max-width:991px){
  .cc-content .courses-details-content p,.cc-content .courses-details-content .courses-details-list,.cc-content .about-area .about-content,.cc-content .faq-wrapper{max-width:none;}
  .cc-content .courses-details-content p,.cc-content .about-content p{font-size:16px; line-height:1.7;}
  .cc-content .faq-wrapper .accordion .card{padding:14px 14px 14px 52px;}
  .cc-content .faq-wrapper .accordion .card .question{left:12px;}
  .cc-content .faq-wrapper .accordion .card .card-body .answer{left:-40px;}
}
