/* ========================= Sezione 1 ============================= */
/* ================== CASA REV – COME FUNZIONA (Regola #1) ================== */
/* Prefisso univoco: casarev-cf- */

.casarev-cf-section{
  --cf-max: 1200px;
  --cf-text: #1a1a1a;
  --cf-muted: #666666;
  --cf-gap: clamp(20px, 3.5vw, 40px);
  --cf-green: #19c15a;
  color: var(--cf-text);
  padding: clamp(32px, 6vw, 64px) 16px;
}

.casarev-cf-container{
  max-width: var(--cf-max);
  margin-inline: auto;
}

.casarev-cf-header{
  text-align: center;
  margin-bottom: clamp(24px, 5vw, 48px);
}

.casarev-cf-kicker{
  font-size: 36px;
  font-weight: 600;
  color: #000;
  letter-spacing: 1.25;
  text-transform: uppercase;
  margin: 0 0 8px;
}

.casarev-cf-title{
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 5vw, 44px);
  line-height: 1.15;
  margin: 0 0 14px;
}

.casarev-cf-subtitle{
  font: 400 clamp(16px, 1.8vw, 20px)/1.6 "Poppins", sans-serif;
  color: var(--cf-muted);
  margin: 0;
}

.casarev-cf-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--cf-gap);
  align-items: center;
  margin-top: clamp(24px, 4vw, 40px);
}

.casarev-cf-art{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.casarev-cf-art img{
  width: 100%;
  height: auto;
  max-width: 560px;     /* proporzione simile alla grafica */
  object-fit: contain;
}

.casarev-cf-text{
  font-family: "Poppins", sans-serif;
  font-size: 16px;
}

.casarev-cf-lead{
  font-size: clamp(16px, 1.8vw, 18px);
  margin: 0 0 10px;
}

.casarev-cf-par{
  margin: 0 0 16px;
  font-size: 18px !important;
}

.casarev-cf-list{
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
}

.casarev-cf-list li{
  font-size: 18px !important;
  position: relative;
  padding-left: 34px;
  margin: 12px 0;
  color: #666;
}

/* Icona check verde (png) passata via CSS custom property inline sul SECTION) */
.casarev-cf-liicon{
  position: absolute;
  left: 0; top: .25em;
  width: 22px; height: 22px;
  background-image: var(--casarev-cf-icon);
  background-size: 22px 22px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 4px;
  display: inline-block;
}

.casarev-cf-list li::before {
  content:"";position:absolute;left:0;top:-1px;width:20px;height:20px;
  background:url('img/v-icon.png') no-repeat left 3px;
  background-size:20px 20px;
}

/* -------------------- Responsive -------------------- */
@media (max-width: 1024px){
  .casarev-cf-grid{
    grid-template-columns: 1fr;
  }
  .casarev-cf-art{ order: -1; }     /* immagine sopra al testo */
  .casarev-cf-art img{ max-width: 440px; }
}
@media (max-width: 560px){
  .casarev-cf-section{ padding-inline: 14px; }
  .casarev-cf-title{ font-size: clamp(26px, 7vw, 32px); }
  .casarev-cf-subtitle{ font-size: clamp(15px, 3.8vw, 18px); }
}

/* CTA finale */
.casarev-cf-cta{
  margin-top: 28px;
}

.casarev-cf-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #000;
  font-weight: 700;
  text-transform: uppercase;
  padding: 14px 28px;
  border-radius: 999px;
  border: 1px solid #000;
  text-decoration: none;
  transition: all .15s ease;
  box-shadow: 0 4px 7px rgba(0,0,0,.25);
}

.casarev-cf-btn:hover{
  background: var(--btn-hover);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 7px 10px rgba(0,0,0,.45);
}







/* ========================= Sezione 2 ============================= */

/* ================= CASA REV – Ecosistema Marchi (prefisso: cr-cf2-) ================= */

.cr-cf2-wrap{
  background: var(--cr-cf2-bg, #fff6cc);
  padding: clamp(32px, 7vw, 60px) 16px;
  color: #1a1a1a;
  font-family: "Poppins", sans-serif;
}

.cr-cf2-container{ max-width: 1200px; margin-inline: auto; }

.cr-cf2-header{ text-align: center; margin-bottom: clamp(24px, 5vw, 56px); }

.cr-cf2-title{
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 5vw, 44px);
  line-height: 1.15;
  margin: 0 0 10px;
}

.cr-cf2-subtitle{ margin: 0; font-size: clamp(16px, 1.9vw, 20px); }

.cr-cf2-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}

/* Immagine */
.cr-cf2-art{ margin: 0; display: flex; align-items: center; justify-content: center; }
.cr-cf2-art img{ width: 100%; height: auto; max-width: 560px; object-fit: contain; }

/* Testo */
.cr-cf2-text{ font-size: 16px; color: #2b2b2b; }
.cr-cf2-intro{ margin: 0 0 18px; }

/* Lista con markers immagine */
.cr-cf2-list{ list-style: none; padding: 0; margin: 0; }
.cr-cf2-list li{
  position: relative;
  padding-left: 60px;
  margin: 16px 0;
  line-height: 1.6;
}
.cr-cf2-list li::before{
  content: "";
  position: absolute;
  left: 0; top: -5px;
  width: 45px; height: 45px;
}

.cr-cf2-list-vendi::before {
  content:"";position:absolute;left:0;top:-1px;width:45px;height:45px;
  background:url('img/vendiristrutturato-icon.png') no-repeat left 3px;
  background-size:45px 45px;
}

.cr-cf2-list-compra::before {
  content:"";position:absolute;left:0;top:-1px;width:45px;height:45px;
  background:url('img/compraristrutturato-icon.png') no-repeat left 3px;
  background-size:45px 45px;
}

.cr-cf2-list-cliente::before {
  content:"";position:absolute;left:0;top:-1px;width:45px;height:45px;
  background:url('img/clienteristrutturato-icon.png') no-repeat left 3px;
  background-size:45px 45px;
}

/* CTA esterna, centrata */
.cr-cf2-cta{
  margin-top: clamp(36px, 3.5vw, 48px);
  display: flex;
  justify-content: center;
}
.cr-cf2-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #000;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1;
  padding: 14px 26px;
  border-radius: 999px;
  border: 1px solid#000;
  text-decoration: none;
  box-shadow: 0 4px 7px rgba(0,0,0,.18);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.cr-cf2-btn:hover{
  background: var(--btn-hover);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 7px 12px rgba(0,0,0,.26);
}

/* Responsive */
@media (max-width: 1024px){
  .cr-cf2-grid{ grid-template-columns: 1fr; }
  /* mantieni l'ordine invertito anche su mobile: testo sopra, immagine sotto */
  .cr-cf2-text{ order: -1; }
  .cr-cf2-art img{ max-width: 520px; }
}
@media (max-width: 560px){
  .cr-cf2-wrap{ padding-inline: 14px; }
  .cr-cf2-title{ font-size: clamp(26px, 7vw, 32px); }
  .cr-cf2-subtitle{ font-size: clamp(15px, 3.8vw, 18px); }
}
}





/* ========================= Sezione 3 ============================= */

/* ===== CasaRev – Community / WorkSpace (cr-cf3-*) ===== */

.cr-cf3-wrap{
  color: #1a1a1a;
  font-family: "Poppins", sans-serif;
  background: #ffffff;
}

.cr-cf3-container{
  max-width: 1200px;
  margin-inline: auto;
  margin: 60px auto;
}

/* Head */
.cr-cf3-header{
  text-align: center;
  margin-bottom: clamp(20px, 4.5vw, 40px);
}

.cr-cf3-title{
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 5vw, 44px);
  line-height: 1.15;
  margin: 0 0 8px;
}

.cr-cf3-subtitle{
  font-family: "Montserrat", sans-serif;
  color: #000;
  font-size: 24px !important;
  margin: 0;
  font-size: clamp(16px, 1.9vw, 20px);
}

/* Grid */
.cr-cf3-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
  margin-top: clamp(16px, 3vw, 28px);
}

.cr-cf3-text{
  font-size: 16px;
  color:#666;
}

.cr-cf3-text p{
  margin: 0 0 14px;
}

.cr-cf3-text strong{
  font-weight: 700;
}

.cr-cf3-art{
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cr-cf3-art img{
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* CTA centrata */
.cr-cf3-cta{
  display: flex;
  justify-content: center;
  margin-top: clamp(24px, 4vw, 36px);
}

.cr-cf3-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #000;
  font-weight: 700;
  text-transform: uppercase;
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid #000;
  text-decoration: none;
  line-height: 1;
  box-shadow: 0 4px 7px rgba(0,0,0,.2);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}

.cr-cf3-btn:hover{
  background:var(--btn-hover);
  color:#fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 14px rgba(0,0,0,.25);
}

/* Responsive */
@media (max-width: 1024px){
  .cr-cf3-grid{
    grid-template-columns: 1fr;
  }
  .cr-cf3-art{
    order: 2; /* immagine sotto al testo su tablet/mobile */
  }
  .cr-cf3-art img{
    max-width: 520px;
  }
}

@media (max-width: 560px){
  .cr-cf3-wrap{
    padding-inline: 14px;
  }
  .cr-cf3-title{
    font-size: clamp(26px, 7vw, 32px);
  }
  .cr-cf3-subtitle{
    font-size: clamp(15px, 3.8vw, 18px);
  }
}







/* ========================= Sezione 4 ============================= */


/* ===== CasaRev – Ecosistema Selettivo (cr-cf5-*) ===== */

.cr-cf5-wrap{
  background: var(--cr-cf5-bg, #fff6cc);
  padding-block: clamp(32px, 6vw, 60px);  /* spazio interno verticale */
  padding-inline: 16px;
  color:#666;
  font-family:"Poppins", sans-serif;
}

.cr-cf5-container{
  max-width: 800px;
  margin-inline: auto;
}

.cr-cf5-header{
  text-align: center;
  margin-bottom: clamp(18px, 3.8vw, 36px);
}

.cr-cf5-title{
  font-family:"Montserrat", sans-serif;
  font-size: 36px !important;
  font-weight: 700;
  max-width: 670px;
  line-height: 1.15;
  font-size: clamp(28px, 5vw, 44px);
  margin: 0 auto;
}

/* Contenuti */
.cr-cf5-content{
  max-width: 980px;
  margin-inline: auto;
  font-size: 16px;
  color:#2b2b2b;
}

/* Lista con marker 'mano' */
.cr-cf5-list{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
}
.cr-cf5-list li{
  position: relative;
  padding-left: 42px;
  margin: 14px 0;
  line-height: 1.7;
}
.cr-cf5-list li::before{
  content:"";position:absolute;left:0;top:-1px;width:20px;height:20px;
  background:url('img/hand-icon.png') no-repeat left 3px;
  background-size:20px 20px;
}

/* Paragrafi finali */
.cr-cf5-par{
  margin: 14px 0;
  line-height: 1.7;
}

/* Responsive minori */
@media (max-width: 560px){
  .cr-cf5-wrap{ padding-inline: 14px; }
  .cr-cf5-title{ font-size: clamp(26px, 7vw, 32px); }
}