
/*
Theme Name: Nome Child Theme
Template: hello-biz
Version: 1.0
*/



/* ====== CLOUD PRODOTTI (BASE) ====== */








/*.bo-cloud-wrapper{*/
/*    position:relative;*/
/*    width:100vw;*/
/*    height:100vh;*/
/*    left:50%;*/
/*    transform:translateX(-50%);*/
/*    display:flex;*/
/*    justify-content:center;*/
/*    align-items:center;*/
/*    overflow:hidden;*/
/*    z-index:1;*/
/*}*/

.bo-cloud-wrapper{
    position:relative;
    width:100vw;
    height:calc(100vh - 130px); /* 120px ≈ altezza header */
    margin-top:-70px !important;           /* tira un po’ su la nuvola */
    left:50%;
    transform:translateX(-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
    z-index:1;
}


.bo-cloud{
    position:relative;
    width:100%;
    height:100%;
}

/* ogni item viene centrato e poi spostato via JS */
.bo-cloud-item{
    position:absolute;
    top:50%;
    left:50%;
    z-index:1;
}



.bo-cloud-item.is-focused-item{
    z-index:9999;
}
@keyframes bo-card-float {
    0% { transform:translateY(0); }
    50% { transform:translateY(-8px); }
    100% { transform:translateY(0); }
}

.bo-cloud-card.is-floating{
    animation:bo-card-float 6s ease-in-out infinite;
}
/* CARD */
.bo-cloud-card{
    position:relative;
    display:block;
    width: clamp(220px, 18vw, 340px);
    border-radius:40px;
    overflow:hidden;
    transform-origin:center center;
    opacity:0; /* parte invisibile */

    /* animazioni:
    - transform e box-shadow: per focus/centratura
    - opacity: per cambio prodotto (fade) più rapido
    */
    transition:
            transform .6s cubic-bezier(.22,.61,.36,1),
            box-shadow .6s cubic-bezier(.22,.61,.36,1),
            opacity .6s ease;
}


.bo-cloud-card.is-entered{
    opacity:1;
    transform:translateY(0) scale(1);
}

/* immagine bottiglia */
.bo-cloud-mask img{
    width:100%;
    height:auto;
    object-fit:cover;
}

/* card centrata */
.bo-cloud-card.is-focused{
    animation:none;
    background:#fff;
    z-index:9999; /* sopra tutto il resto della nuvola */
}

/* overlay scuro quando c'è focus */
body.bo-cloud-has-focus .bo-cloud-wrapper::after{
    content:"";
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.55);
    pointer-events:none;
    z-index:0;
}


.bo-cloud-info{
    position:absolute;
    left:50%;
    bottom:20px;
    transform:translateX(-50%);
    min-width:220px;
    padding:14px 16px 16px;
    border-radius:18px;
    background:#fff;
    color:#111;
    box-shadow:0 18px 40px rgba(0,0,0,.25);
    display:none;
}

/* mostro il box quando l’item è focusato */
.bo-cloud-item.is-focused-item .bo-cloud-info{
    display:block;
}

.bo-cloud-info-title{
    margin:0 0 8px;
    font-size:15px;
    font-weight:600;
    text-align:center;
}

.bo-cloud-info-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 16px;
    border-radius:999px;
    background:#d81b60;
    color:#fff;
    font-size:13px;
    text-decoration:none;
}




.bo-cloud-info-overlay{
    position:fixed;
    left:50%;
    bottom:40px;
    transform:translateX(-50%) translateY(20px);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
    z-index:10000;
}

.bo-cloud-info-overlay.is-visible{
    opacity:1;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0);
}

.bo-cloud-info-inner{
    min-width:260px;
    padding:14px 16px 16px;
    border-radius:18px;
    background:#fff;
    color:#111;
    box-shadow:0 18px 40px rgba(0,0,0,.25);
    position:relative;
}

.bo-cloud-info-title{
    margin:0 0 8px;
    font-size:15px;
    font-weight:600;
}

.bo-cloud-info-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 16px;
    border-radius:999px;
    background:#d81b60;
    color:#fff;
    font-size:13px;
    text-decoration:none;
}

.bo-cloud-info-close{
    position:absolute;
    top:8px;
    right:10px;
    width:24px;
    height:24px;
    border-radius:999px;
    border:none;
    background:#111;
    color:#fff;
    font-size:16px;
    line-height:1;
    cursor:pointer;
}

.bo-cloud-item:nth-child(1) .bo-cloud-card{
    transform:scale(1.05);
}


.bo-cloud-tooltip{
    position:fixed;
    left:0;
    top:0;
    transform:translate(-50%, -120%);
    padding:10px 14px;
    border-radius:8px;
    background:#FFF;
    color:#000;
    border: 1px solid;
    font-size:25px; /* testo più grande */
    font-weight:800;
    line-height:1.2;
    pointer-events:none;
    text-transform: uppercase;
    opacity:0;
    transition:opacity .15s ease;
    z-index:10001;
    white-space:nowrap;
    font-family: "Futura LT Paneuropean", Courier, monospace !important;
}

.bo-cloud-tooltip.is-visible{
    opacity:1;
}


body {
    font-family: 'Futura LT Paneuropean', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

h1, h2, h3, .topmenu {
    font-family: 'Grold', 'Raleway', 'Futura LT Paneuropean', sans-serif !important;
    font-weight: 700;
}

.topmenu a {
    text-transform: uppercase !important;
    font-weight: bold !important;
}


.bo-cloud-wrapper {
    position:relative;
    width:100vw;
    height:calc(100vh - 130px);
    margin-top:-40px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
    z-index:1;
}

/* Toggle in basso, simile al tuo esempio */
.bo-cloud-toggle{
    position:absolute;
    left:50%;
    bottom:0;
    transform:translateX(-50%);
    display:inline-flex;
    border-radius:2px;
    overflow:hidden;
    border:1px solid #000;
    z-index:10002;
}

.bo-cloud-toggle-btn{
    border:none;
    background:#fff;
    color:#000;
    padding:10px 26px;
    font-size:14px;
    font-weight:700;
    letter-spacing:0.06em;
    text-transform:uppercase;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
}

.bo-cloud-toggle-btn.is-active{
    background:#000;
    color:#fff;
}

button.bo-cloud-toggle-btn:hover {
    background-color: #000;
}


.bo-cloud-wrapper {
    min-height: 780px;
}
/* Modalità griglia */
.bo-cloud.is-grid .bo-cloud-item{
    position:static;
    transform:none;
    top:auto;
    left:auto;
}

.bo-cloud.is-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:24px;
    padding:40px 40px 90px; /* spazio sopra + margine per il toggle */
    justify-items:center;
    align-items:flex-start;
}

.bo-cloud.is-grid .bo-cloud-card{
    width:220px;
    border-radius:24px;
    animation:none;
    transform:none !important;
    opacity:1;
    box-shadow:0 8px 20px rgba(0,0,0,.15);
}

.bo-cloud.is-grid .bo-cloud-card.is-focused{
    /* niente centratura in modalità griglia */
}

.bo-cloud.is-grid .bo-cloud-card.is-floating{
    animation:none;
}

/* quando sono in griglia nascondo overlay e tooltip */
.bo-cloud.is-grid ~ .bo-cloud-info-overlay,
.bo-cloud.is-grid ~ #bo-cloud-tooltip{
    display:none !important;
}
body.bo-cloud-has-focus .bo-cloud-wrapper::after{
    /* ombra solo in modalità cloud, non in griglia */
}

.bpfwe-custom-field-wrapper li:has(input[value="No"]) {
    display: none !important;
}


.bpfwe-taxonomy-wrapper label span.label-text,
.bpfwe-custom-field-wrapper label span.label-text {
    display: inline-block;
    transform: translateY(2px);
}

