/*

    <link rel="stylesheet" href="/portals/0/Cassonetti/4a/css/cassonetti.css">
   
*/
/* ============================
       NAMESPACE anti-override DNN
       ============================ */
    .cassonetti-page,
    .cassonetti-page p,
    .cassonetti-page li,
    .cassonetti-page h1,
    .cassonetti-page h2,
    .cassonetti-page h3,
    .cassonetti-page small{
      color:#1f2a33 !important;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    .cassonetti-page a{ color:#0b7a57 !important; }

    /* ===== Palette ===== */
    .c-green{ color:#0b7a57 !important; }
    .bg-green{ background:#0b7a57; }
    .bg-green-dark{ background:#075842; }
    .bg-yellow{ background:#f2df58; }
    .text-white{ color:#fff !important; }

    .cassonetti-page{ padding:18px 0 25px; }

    /* ===== Titolo ===== */
    .cassonetti-page .flyer-title{
      margin:0 0 12px;
      line-height:1.02;
      letter-spacing:.5px;
      font-weight:900;
      text-transform:uppercase;
    }
    .cassonetti-page .flyer-title .t1{ display:block; color:#111 !important; font-size:44px; }
    .cassonetti-page .flyer-title .t2{ display:block; color:#0b7a57 !important; font-size:48px; }

    /* ===== Testo ===== */
    .cassonetti-page .lead-block p{
      margin:0 0 10px;
      line-height:1.45;
      color:#4d5b66 !important;
      font-size:14.5px;
      font-weight:600;
    }
    .cassonetti-page .lead-block strong{ color:#0f1f2a !important; font-weight:800; }

    .cassonetti-page .dropcap{
      float:left;
      font-size:42px;
      line-height:40px;
      padding:2px 8px 0 0;
      color:#0b7a57 !important;
      font-weight:900;
    }

    .cassonetti-page .checklist{
      margin:10px 0 12px;
      padding-left:0;
      list-style:none;
      color:#4d5b66 !important;
      font-size:14.5px;
      font-weight:600;
    }
    .cassonetti-page .checklist li{
      margin:5px 0;
      padding-left:22px;
      position:relative;
    }
    .cassonetti-page .checklist li:before{
      content:"✓";
      position:absolute;
      left:0; top:0;
      color:#0b7a57;
      font-weight:900;
    }

    /* ===== Colonna destra: immagini + etichette inclinate ===== */
    .cassonetti-page .bins{ margin-top:6px; }
    .cassonetti-page .bin-card{
      position:relative;
      margin-bottom:18px;
    }
    .cassonetti-page .bin-img{
      width:100%;
      height:auto;
      border:1px solid rgba(0,0,0,.10);
      background:#fff;
      padding:6px;
      box-shadow:0 2px 10px rgba(0,0,0,.06);
    }

    /* Etichetta tipo “ribbon” inclinata */
    .cassonetti-page .bin-label{
      position:absolute;
      right:-10px;
      top:58%;
      transform:translateY(-50%) rotate(-8deg);
      padding:10px 14px;
      font-weight:900;
      text-transform:uppercase;
      letter-spacing:.3px;
      line-height:1.05;
      border:1px solid rgba(0,0,0,.18);
      box-shadow:0 3px 14px rgba(0,0,0,.14);
      max-width:78%;
      z-index:2;
    }
    .cassonetti-page .bin-label.green{
      background:#0b7a57;
      color:#fff !important;
    }
    .cassonetti-page .bin-label.yellow{
      background:#f2df58;
      color:#18313f !important;
    }
    /* “punta” del ribbon */
    .cassonetti-page .bin-label:after{
      content:"";
      position:absolute;
      right:10px;
      bottom:-10px;
      width:0; height:0;
      border-left:10px solid transparent;
      border-right:10px solid transparent;
      border-top:10px solid rgba(0,0,0,.18);
      opacity:.25;
      transform: rotate(8deg);
    }

    /* ===== Sezione “COME APRIRE” ===== */
    .cassonetti-page .howto{ margin-top:10px; }
    .cassonetti-page .howto-bar{
      background:#0b7a57;
      color:#fff !important;
      text-align:center;
      font-weight:900;
      text-transform:uppercase;
      padding:10px 12px;
      letter-spacing:.4px;
      margin:0;
    }
    .cassonetti-page .howto-body{
      border:1px solid rgba(0,0,0,.10);
      border-top:0;
      padding:14px 14px 8px;
      background:#fff;
      box-shadow:0 2px 10px rgba(0,0,0,.06);
    }
    .cassonetti-page .howto-sub{
      color:#0b7a57 !important;
      font-weight:900;
      text-transform:uppercase;
      margin:0 0 8px;
      font-size:13px;
    }
    .cassonetti-page .steps{
      list-style:none;
      padding-left:0;
      margin:0 0 10px;
    }
    .cassonetti-page .steps li{
      display:flex;
      gap:10px;
      margin:8px 0;
      line-height:1.25;
      color:#4d5b66 !important;
      font-size:13.5px;
      font-weight:700;
    }
    .cassonetti-page .num{
      flex:0 0 26px;
      height:26px;
      border-radius:50%;
      background:#eaf6f1;
      color:#0b7a57 !important;
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:900;
      border:1px solid rgba(11,122,87,.25);
    }

    .cassonetti-page .qr-box{ text-align:right; padding-top:6px; }
    .cassonetti-page .qr-title{
      color:#0b7a57 !important;
      font-weight:900;
      margin:0 0 6px;
      text-transform:uppercase;
      font-size:12px;
      line-height:1.2;
    }
    .cassonetti-page .qr-img{
      max-width:130px;
      height:auto;
      border:1px solid rgba(0,0,0,.15);
      padding:6px;
      background:#fff;
    }

    /* ===== Responsive ===== */
    @media (max-width: 767px){
      .cassonetti-page{ padding:12px 0 18px; }
      .cassonetti-page .flyer-title .t1{ font-size:34px; }
      .cassonetti-page .flyer-title .t2{ font-size:36px; }

      /* su mobile: label non inclinata e sotto immagine */
      .cassonetti-page .bin-label{
        position:static;
        transform:none;
        margin-top:8px;
        display:inline-block;
        max-width:100%;
        right:auto; top:auto;
      }
      .cassonetti-page .bin-label:after{ display:none; }

      .cassonetti-page .qr-box{ text-align:left; margin-top:10px; }
    }
  