/* Angoli arrotondati uguali per tutti i box del sito (18px desktop, 14px mobile) e, in fondo, stile delle card dei widget.
   Collegato da content/sys/footer_js.php DOPO css/style-responsive-addon.min.css, che forza border-radius:3px!important.
   Elenco ricavato dall'analisi di tutte le pagine di content/ (2026-10-13): box squadrati + box con curve diverse (10/14/16/22px).
   Per un box nuovo con la stessa curva: aggiungere la sua classe qui (e cambiare la versione nel link se serve).
   Su mobile le sezioni della home-login sono box con margini (regole in content/home_login.php). */
body .listing-item,
body .etichetta_price,
body .pricing-item-inner,
body .pp-box, body .pp-card, body .tc-box, body .tc-card, body .ck-box, body .ck-card,
body .section_banner_video,
body .bg-gray-lighter-new.small-section,
body #news.page-section,
body a.submit_btn.btn-medium,
body .sy-box, body .sy-oggi, body .sy-video, body .sy-contatto-box, body .sy-ct-box, body .sy-passo,
body .sy-rec-card, body .sy-rec-risposta, body .sy-seg-voce, body .sy-giorno, body .sy-comm-box,
body .yi-card, body .yi-pain, body .yi-book-card, body .yi-book-form, body .yi-bio-num, body .rg-corso-img a { border-radius: 18px !important; }
body .pricing-title { border-top-left-radius: 18px !important; border-top-right-radius: 18px !important; }
body .listing-item, body .section_banner_video, body .etichetta_price, body #news.page-section { overflow: hidden; }
@media (max-width: 991px) {
  body .listing-item,
  body .etichetta_price,
  body .pricing-item-inner,
  body .pp-box, body .pp-card, body .tc-box, body .tc-card, body .ck-box, body .ck-card,
  body .section_banner_video,
  body .bg-gray-lighter-new.small-section,
  body #news.page-section,
  body a.submit_btn.btn-medium,
  body .sy-box, body .sy-oggi, body .sy-video, body .sy-contatto-box, body .sy-ct-box, body .sy-passo,
  body .sy-rec-card, body .sy-rec-risposta, body .sy-seg-voce, body .sy-giorno, body .sy-comm-box,
  body .yi-card, body .yi-pain, body .yi-book-card, body .yi-book-form, body .yi-bio-num, body .rg-corso-img a { border-radius: 14px !important; }
  body .pricing-title { border-top-left-radius: 14px !important; border-top-right-radius: 14px !important; }
}

/* ====================================================================================================
   Card foto + testo dei widget (prima in content/widget/sy_card_style.php, spostate qui il 2026-10-14:
   niente file PHP solo per lo stile). widget/live_box.php, yoga_personalizzato.php, last_corso.php,
   lezioni_del_mese.php. Su mobile la card e' un box con 15px di margine ai lati e angoli 14px.
   ==================================================================================================== */
@media (min-width: 992px) {
  .sy-card-section .row .listing-item.sy-card { border-radius: 18px !important; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.08) !important; }
}
@media (max-width: 991px) {
  .sy-card-section > .container { padding-left: 0; padding-right: 0; }
  .sy-card-section > .container > .row, .sy-card-section > .container > .row > .row { margin-left: 0 !important; margin-right: 0 !important; }
  /* selettore piu' specifico: css/style-responsive-addon.min.css (caricato nel footer) forza .listing-item{width:90%!important} */
  .sy-card-section .row .listing-item.sy-card { margin-left: 15px !important; margin-right: 15px !important; width: calc(100% - 30px) !important;
    border-radius: 14px !important; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.08) !important; }
  .sy-card-section .title_center { padding-left: 15px !important; padding-right: 15px !important; }
}
.sy-card { display: flex !important; align-items: stretch; padding: 16px !important; gap: 10px; }
.sy-card-img { flex: 0 0 50%; min-height: 380px; border-radius: 14px; background-size: cover; background-position: center 30%; position: relative; overflow: hidden; }
.sy-card-body { flex: 1; padding: 20px 30px 20px 36px; display: flex; flex-direction: column; justify-content: center; }
.sy-card-body h4 { margin: 0 0 14px; font-size: 18px; line-height: 1.45; }
.sy-card-body p, .sy-desc { font-size: 14px; }
.sy-card-body p { margin: 0 0 22px; color: #666; line-height: 1.8em; }
.sy-card-btns .btn-border { border-color: #1A797F; color: #1A797F; }
.sy-card-btns .btn-border:hover { background: #1A797F; color: #fff; }
.sy-eyebrow { font-size: 12px; color: #1A797F; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.sy-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: #777; margin-bottom: 20px; }
.sy-meta i { color: #1A797F; margin-right: 6px; }
.sy-card-btns { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.sy-card-btns .btn { margin: 0; }
/* badge sulla foto */
.sy-badge { position: absolute; left: 14px; background: #fff; color: #333; font-size: 11px; padding: 6px 13px; border-radius: 30px; box-shadow: 0 4px 14px rgba(0,0,0,.12); display: inline-flex; align-items: center; gap: 7px; }
.sy-badge-top { top: 14px; }
.sy-badge-bottom { bottom: 14px; }
.sy-dot { width: 8px; height: 8px; border-radius: 50%; background: #e53935; display: inline-block; animation: sy-pulse 1.5s infinite; }
@keyframes sy-pulse { 0% { box-shadow: 0 0 0 0 rgba(229,57,53,.55); } 70% { box-shadow: 0 0 0 8px rgba(229,57,53,0); } 100% { box-shadow: 0 0 0 0 rgba(229,57,53,0); } }
/* live: countdown a tessere e descrizione apribile */
.sy-count { display: flex; gap: 10px; margin-bottom: 22px; }
.sy-count div { flex: 1; max-width: 86px; background: #eef5f5; border-radius: 12px; padding: 12px 6px 10px; text-align: center; }
.sy-count b { display: block; font-size: 28px; line-height: 1; color: #1A797F; font-weight: 600; }
.sy-count span { display: block; font-size: 10px; margin-top: 6px; color: #777; }
.sy-count .sy-count-end { max-width: none; background: #1A797F; color: #fff; font-size: 13px; padding: 14px; }
.sy-desc { position: relative; max-height: 7.2em; overflow: hidden; margin-bottom: 8px; color: #666; line-height: 1.8em; }
.sy-desc.aperta { max-height: none; }
.sy-desc:not(.aperta):after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2.2em; background: linear-gradient(rgba(255,255,255,0), #fff); }
.sy-desc-toggle { font-size: 12px; color: #1A797F !important; margin-bottom: 22px; display: inline-block; text-decoration: none !important; }
/* 1:1: pannello testo con fondo verde chiaro e punti di forza */
.sy-card-soft .sy-card-body { background: linear-gradient(135deg, #eef5f5 0%, #fff 75%); border-radius: 14px; }
.sy-plus { list-style: none; padding: 0; margin: 4px 0 30px; }
.sy-plus li { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; color: #444; font-size: 18px; line-height: 1.4; }
.sy-plus li i { width: 38px; height: 38px; border-radius: 50%; background: #1A797F; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; flex: none; }
/* corso del mese (widget/last_corso.php): copertina intera, non ritagliata */
.sy-corso .sy-corso-img { flex: 0 0 50%; display: block; border-radius: 14px; overflow: hidden; align-self: center; }
.sy-corso .sy-corso-img img { display: block; width: 100%; height: auto; transition: transform .4s; }
.sy-corso .sy-corso-img:hover img { transform: scale(1.03); }
.sy-corso .sy-card-body h4 a { color: #333; text-decoration: none; }
.sy-corso .sy-card-body h4 a:hover { color: #7A2E2E; }
.sy-corso-testo { font-size: 14px; color: #666; line-height: 1.8em; margin-bottom: 20px; }
.sy-corso-testo p { margin: 0 0 10px; }
.sy-corso-testo p:last-child { margin-bottom: 0; }
/* lezioni della settimana (widget/lezioni_del_mese.php): slider Flickity di card foto + titolo */
.sy-lez-wrap { text-align: left; min-height: 360px; }
.sy-lez-wrap .gallery-cell { width: 30%; height: auto !important; min-height: 0 !important; margin-right: 16px; padding: 4px 0 24px; }   /* flickity-view.min.css: min-height 500px, home4.css: height 400px */
.sy-lez-wrap .gallery-cell .listing-item.sy-lez { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }   /* style-responsive-addon: .listing-item 90% */
.sy-lez { display: flex !important; flex-direction: column; height: 100%; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,.08); text-align: left; }
.sy-lez-img { position: relative; display: block; aspect-ratio: 16 / 10; background: #eee center / cover no-repeat; }
.sy-lez-img:after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,0); transition: background .2s; }
.sy-lez-img:hover:after { background: rgba(0,0,0,.08); }
.sy-lez-play { position: absolute; inset: 0; margin: auto; z-index: 1; width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.95);
  display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 20px rgba(0,0,0,.2); transition: transform .2s; }
.sy-lez-play i { font-size: 16px !important; line-height: 1 !important; color: #1A797F !important; margin-left: 3px; width: auto !important; height: auto !important; }
.sy-lez-img:hover .sy-lez-play { transform: scale(1.08); }
.sy-lez-giorno, .sy-lez-visto { position: absolute; top: 12px; z-index: 1; font-size: 10px; padding: 5px 11px; border-radius: 30px; box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.sy-lez-giorno { left: 12px; background: #fff; color: #333; }
.sy-lez-giorno.oggi { background: #1A797F; color: #fff; }
.sy-lez-visto { right: 12px; background: rgba(255,255,255,.95); color: #1A797F; }
.sy-lez-body { flex: 1; display: flex; flex-direction: column; padding: 18px 20px 16px; }
.sy-lez-body h4 { font-size: 14px; line-height: 1.5; margin: 0 0 14px; min-height: 42px; }
.sy-lez-body h4 a { color: #333; text-decoration: none; }
.sy-lez-body h4 a:hover { color: #7A2E2E; }
.sy-lez-meta { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 11px; color: #7A2E2E; }
.sy-lez-meta i { margin-right: 4px; }
@media (max-width: 992px) {
  .sy-lez-wrap .gallery-cell { width: 50%; }
}
@media (max-width: 502px) {
  .sy-lez-wrap .gallery-cell { width: 80%; }
  .sy-lez-wrap .flickity-prev-next-button { display: none; }   /* su telefono si scorre col dito: le frecce coprivano il testo */
}
@media (max-width: 991px) {
  .sy-corso .sy-corso-img { flex: none; border-radius: 0; }
  .sy-card { flex-direction: column; margin-left: 0 !important; width: 100%; padding: 0 !important; gap: 0; }
  .sy-card-img { flex: none; min-height: 280px; border-radius: 0; }
  .sy-card-body { padding: 24px 20px 30px; }
  .sy-card-soft .sy-card-body { border-radius: 0; }
  .sy-card-btns .btn { width: 100%; white-space: normal; line-height: 1.6; }
  .sy-count { gap: 8px; }
  .sy-count b { font-size: 24px; }
  .sy-plus li { font-size: 16px; }
}

/* Prima sezione della home-login (content/widget/home/slide_new2.php): saluto, titolo e quattro scelte a tessera */
#home .sy-hero { position: relative; min-height: 440px; display: flex; align-items: center; background-size: cover; background-position: center; }
#home .sy-hero:before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(30,22,22,.68) 0%, rgba(30,22,22,.5) 50%, rgba(30,22,22,.68) 100%); }
#home.hm-new { margin-bottom: 80px; }   /* stesso spazio delle altre sezioni della home-login */
.sy-hero-in { position: relative; z-index: 1; padding: 64px 15px; text-align: center; }
.sy-hero-saluto { color: #fff; font-size: 13px; letter-spacing: .3em; text-transform: uppercase; margin-bottom: 12px; text-shadow: 0 1px 10px rgba(0,0,0,.45); }
.sy-hero-titolo { color: #fff; font-size: 32px; line-height: 1.3; margin: 0 0 34px; text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.sy-hero-scelte { display: grid; grid-template-columns: repeat(4, minmax(0, 210px)); gap: 14px; justify-content: center; }
.sy-hero-scelte.due { grid-template-columns: repeat(2, minmax(0, 210px)); }
.sy-hero-scelta { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 20px 12px 18px; background: rgba(255,255,255,.93);
  border-radius: 14px; color: #333 !important; text-decoration: none !important; box-shadow: 0 10px 30px rgba(0,0,0,.18); transition: transform .2s, background .2s; }
.sy-hero-scelta:hover { transform: translateY(-3px); background: #fff; }
.sy-hero-scelta i { width: 46px; height: 46px; border-radius: 50%; background: #eef5f5; color: #1A797F; display: flex; align-items: center; justify-content: center;
  font-size: 17px; margin-bottom: 6px; transition: background .2s, color .2s; }
.sy-hero-scelta:hover i { background: #1A797F; color: #fff; }
.sy-hero-scelta b { font-size: 13px; letter-spacing: .15em; text-transform: uppercase; font-weight: 600; }
.sy-hero-scelta small { font-size: 11px; color: #888; letter-spacing: 0; }
@media (max-width: 767px) {
  #home .sy-hero { min-height: 0; }
  .sy-hero-in { padding: 40px 15px 32px; }
  .sy-hero-saluto { font-size: 14px; }
  .sy-hero-titolo { font-size: 25px; margin-bottom: 24px; }
  .sy-hero-scelta b { font-size: 14px; }
  .sy-hero-scelta small { font-size: 12px; }
  .sy-hero-scelte, .sy-hero-scelte.due { grid-template-columns: 1fr 1fr; gap: 10px; }
  .sy-hero-scelta { padding: 16px 8px 14px; }
  .sy-hero-scelta i { width: 42px; height: 42px; font-size: 16px; }
}
/* desktop: prima sezione piu' grande e leggibile (su schermi larghi i testi erano piccoli nel banner) */
@media (min-width: 992px) {
  #home .sy-hero { min-height: 500px; }
  .sy-hero-saluto { font-size: 16px; margin-bottom: 16px; }
  .sy-hero-titolo { font-size: 46px; margin-bottom: 44px; }
  .sy-hero-scelte, .sy-hero-scelte.due { grid-template-columns: repeat(4, minmax(0, 250px)); gap: 20px; }
  .sy-hero-scelte.due { grid-template-columns: repeat(2, minmax(0, 250px)); }
  .sy-hero-scelta { padding: 28px 16px 24px; gap: 6px; border-radius: 18px; }
  .sy-hero-scelta i { width: 60px; height: 60px; font-size: 22px; margin-bottom: 10px; }
  .sy-hero-scelta b { font-size: 16px; }
  .sy-hero-scelta small { font-size: 13px; }
}
/* mobile: spazio tra le sezioni della home-login ridotto a 50px (desktop 80px) */
@media (max-width: 991px) {
  #home.hm-new { margin-bottom: 50px; }
}

/* Pannello "Continua un corso gia' iniziato" (content/widget/video_box_corsi_continua.php), si apre sopra la home-login */
.video_time_box.sy-cont { top: 0; height: 100%; width: 100%; z-index: 100000; background: #2b2626; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.sy-cont-in { padding-top: 100px; padding-bottom: 60px; text-align: left; }
.sy-cont-torna { display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border-radius: 40px; background: rgba(255,255,255,.1);
  color: #fff !important; font-size: 12px; letter-spacing: .15em; text-transform: uppercase; text-decoration: none !important; transition: background .2s; }
.sy-cont-torna:hover { background: rgba(255,255,255,.2); }
.sy-cont-titolo { color: #fff; font-size: 28px; margin: 28px 0 8px; }
.sy-cont-sotto { color: #cfc6c6; font-size: 14px; margin: 0 0 28px; }
.sy-cont-vuoto { margin-top: 26px; color: #ddd; font-size: 16px; }
.sy-cont-vuoto p { margin-bottom: 18px; }
.sy-cont-wrap .gallery-cell { width: 31%; height: auto !important; min-height: 0 !important; margin-right: 20px; padding-bottom: 6px; border-radius: 0 !important; }
.sy-cont-card { background: #fff; border-radius: 18px; overflow: hidden; height: 100%; display: flex; flex-direction: column; box-shadow: 0 14px 34px rgba(0,0,0,.3); }
.sy-cont-img { display: block; }
.sy-cont-img img { display: block; width: 100%; height: auto; }
.sy-cont-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.sy-cont-body h4 { font-size: 14px; line-height: 1.5; margin: 0 0 16px; min-height: 42px; }
.sy-cont-body h4 a { color: #333; text-decoration: none; }
.sy-cont-prog { display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: #777; margin-top: auto; margin-bottom: 8px; }
.sy-cont-prog b { color: #7A2E2E; font-size: 16px; font-weight: 600; }
.sy-cont-barra { height: 8px; border-radius: 8px; background: #f2e4e4; overflow: hidden; margin-bottom: 18px; }
.sy-cont-barra span { display: block; height: 100%; border-radius: 8px; background: linear-gradient(90deg, #a24a4a, #7A2E2E); }
.sy-cont-btn { margin: 0 !important; align-self: flex-start; }
.sy-cont-wrap .flickity-prev-next-button { background: rgba(255,255,255,.9); }
@media (max-width: 992px) {
  .sy-cont-wrap .gallery-cell { width: 48%; }
}
@media (max-width: 600px) {
  .sy-cont-in { padding-top: 80px; }
  .sy-cont-titolo { font-size: 22px; margin-top: 22px; }
  body .sy-cont-wrap .gallery .gallery-cell { width: 84% !important; margin-right: 14px; }   /* scavalca la regola dello slider lezioni in home_login.php */
  .sy-cont-wrap .flickity-prev-next-button { display: none; }
  .sy-cont-btn { align-self: stretch; text-align: center; }
}