/* ============================================================
   RABBIT-OS v71 — MOBILE MACROCARD ACCORDION
   Scope: solo macrocard Home su tablet/smartphone.
   Desktop invariato.
   Apertura/chiusura tramite tap sul titolo della macrocard.
   ============================================================ */

@media (max-width: 820px){
  #home .rabbit-macro-grid{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  #home .rabbit-macro-card{
    min-height:auto !important;
    overflow:hidden !important;
    border-radius:30px !important;
    transition:
      transform .24s ease,
      box-shadow .28s ease,
      border-color .28s ease,
      opacity .22s ease !important;
  }

  #home .rabbit-macro-card:hover,
  #home .rabbit-macro-card:focus-within{
    min-height:auto !important;
    transform:none !important;
  }

  #home .rabbit-macro-cover{
    min-height:220px !important;
    padding:20px !important;
  }

  #home .rabbit-macro-cover h4{
    width:max-content !important;
    max-width:100% !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:12px !important;
    cursor:pointer !important;
    user-select:none !important;
    -webkit-tap-highlight-color:transparent !important;
    touch-action:manipulation !important;
    position:relative !important;
  }

  #home .rabbit-macro-cover h4::after{
    content:"" !important;
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    border-radius:14px !important;
    display:inline-grid !important;
    place-items:center !important;
    background:linear-gradient(135deg,var(--macro),var(--macro-dark)) !important;
    box-shadow:0 14px 28px color-mix(in srgb,var(--macro) 24%,transparent) !important;
    transform:rotate(0deg) !important;
    transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .2s ease !important;
  }

  #home .rabbit-macro-cover h4::before{
    content:"⌄" !important;
    position:absolute !important;
    right:10px !important;
    top:50% !important;
    z-index:2 !important;
    transform:translateY(-53%) !important;
    color:#fff !important;
    font-size:20px !important;
    font-weight:950 !important;
    line-height:1 !important;
    pointer-events:none !important;
    transition:transform .28s cubic-bezier(.2,.8,.2,1) !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-cover h4::after{
    transform:rotate(180deg) !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-cover h4::before{
    transform:translateY(-49%) rotate(180deg) !important;
  }

  #home .rabbit-macro-footer span{
    display:inline-flex !important;
    font-size:0 !important;
  }

  #home .rabbit-macro-footer span::after{
    content:"Tocca il titolo per aprire" !important;
    font-size:11px !important;
    font-weight:950 !important;
    letter-spacing:.04em !important;
    text-transform:uppercase !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-footer span::after{
    content:"Tocca il titolo per chiudere" !important;
  }

  #home .rabbit-macro-card .rabbit-macro-content{
    max-height:0 !important;
    opacity:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
    transform:translateY(16px) !important;
    margin:0 16px 0 !important;
    padding:0 !important;
    transition:
      max-height .46s cubic-bezier(.2,.8,.2,1),
      opacity .24s ease,
      transform .30s ease,
      margin .30s ease,
      padding .30s ease !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-content{
    max-height:760px !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    margin:0 16px 16px !important;
    padding:0 0 2px !important;
  }

  #home .rabbit-macro-card .rabbit-macro-inner-grid .launch-card{
    opacity:0 !important;
    transform:translateY(14px) scale(.985) !important;
    transition:
      opacity .26s ease,
      transform .30s cubic-bezier(.2,.8,.2,1),
      background .18s ease,
      border-color .18s ease !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card{
    opacity:1 !important;
    transform:translateY(0) scale(1) !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(1){transition-delay:.03s !important;}
  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(2){transition-delay:.07s !important;}
  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(3){transition-delay:.11s !important;}
  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(4){transition-delay:.15s !important;}
  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(5){transition-delay:.19s !important;}
  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-inner-grid .launch-card:nth-child(6){transition-delay:.23s !important;}

  #home .rabbit-macro-card.rabbit-macro-open{
    border-color:color-mix(in srgb,var(--macro) 42%,#cbd5e1) !important;
    box-shadow:0 30px 74px rgba(15,23,42,.14),0 10px 28px rgba(15,23,42,.07) !important;
    z-index:3 !important;
  }

  #home .rabbit-macro-grid:has(.rabbit-macro-card.rabbit-macro-open) .rabbit-macro-card:not(.rabbit-macro-open){
    opacity:.88 !important;
  }
}

@media (max-width: 560px){
  #home .rabbit-macro-cover{
    min-height:205px !important;
    padding:18px !important;
  }

  #home .rabbit-macro-cover h4{
    font-size:25px !important;
  }

  #home .rabbit-macro-inner-grid{
    grid-template-columns:1fr !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open .rabbit-macro-content{
    max-height:980px !important;
    margin-left:14px !important;
    margin-right:14px !important;
  }
}


/* ============================================================
   RABBIT-OS v72 — MOBILE MACROCARD CLOSE FIX
   Correzione: su mobile :hover / :focus-within non deve riaprire
   la card dopo la chiusura. Lo stato reale è solo .rabbit-macro-open.
   ============================================================ */

@media (max-width: 820px){
  #home .rabbit-macro-card:not(.rabbit-macro-open):hover,
  #home .rabbit-macro-card:not(.rabbit-macro-open):focus-within{
    min-height:auto !important;
    transform:none !important;
    z-index:1 !important;
  }

  #home .rabbit-macro-card:not(.rabbit-macro-open):hover .rabbit-macro-content,
  #home .rabbit-macro-card:not(.rabbit-macro-open):focus-within .rabbit-macro-content{
    max-height:0 !important;
    opacity:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
    transform:translateY(16px) !important;
    margin:0 16px 0 !important;
    padding:0 !important;
  }

  #home .rabbit-macro-card:not(.rabbit-macro-open):hover .rabbit-macro-inner-grid .launch-card,
  #home .rabbit-macro-card:not(.rabbit-macro-open):focus-within .rabbit-macro-inner-grid .launch-card{
    opacity:0 !important;
    transform:translateY(14px) scale(.985) !important;
  }

  #home .rabbit-macro-card.rabbit-macro-open:hover .rabbit-macro-content,
  #home .rabbit-macro-card.rabbit-macro-open:focus-within .rabbit-macro-content{
    max-height:760px !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
    margin:0 16px 16px !important;
    padding:0 0 2px !important;
  }
}

@media (max-width: 560px){
  #home .rabbit-macro-card.rabbit-macro-open:hover .rabbit-macro-content,
  #home .rabbit-macro-card.rabbit-macro-open:focus-within .rabbit-macro-content{
    max-height:980px !important;
    margin-left:14px !important;
    margin-right:14px !important;
  }
}