/* Module: pizzas */

/* Pizzas + Enchuladas (2 columnas) */
.jh-pizzas{
    display:grid;
    grid-template-columns: 1fr 1fr;
    border-radius: var(--jh-radius);
    overflow:hidden;
    min-height: 730px;
}
.jh-pizzas__col{
    display:flex;
    flex-direction:column;
    min-height: 260px;
}

.jh-pizzas__top{
    padding: 16px 18px;
    display:flex;
    align-items:center;
    min-height: 185px;
}
.jh-pizzas__top--pizzas{
    background: var(--jh-pz-top-bg, var(--jh-entree-naranja-lavado));
}
.jh-pizzas__top--ench{
    background: var(--jh-en-top-bg, var(--jh-entree-rojo-fuerte));
}

.jh-pizzas__title{
    font-family: var(--jh-item-title-font, 'JH_Knockout94', Arial, sans-serif);
    text-transform:uppercase;
    /* font-weight:900; */
    line-height:.85;
    letter-spacing:.6px;
    font-size: clamp(54px, 24vw, 136px);
}
.jh-pizzas__top--pizzas .jh-pizzas__title{
    color: var(--jh-pz-top-color, var(--jh-entree-negro));
}
.jh-pizzas__top--ench .jh-pizzas__title{
    color: var(--jh-en-top-color, var(--jh-entree-naranja-lavado));
}
.jh-pizzas__title span{
    display:contents;
}

.jh-pizzas__title_echulada{
    font-family: var(--jh-item-title-font, 'JH_Knockout94', Arial, sans-serif);
    text-transform:uppercase;
    /* font-weight:900; */
    line-height:.85;
    letter-spacing:.6px;
    font-size: clamp(54px, 18vw, 96px);
}
.jh-pizzas__top--pizzas .jh-pizzas__title_echulada{
    color: var(--jh-pz-top-color, var(--jh-entree-negro));
}
.jh-pizzas__top--ench .jh-pizzas__title_echulada{
    color: var(--jh-en-top-color, var(--jh-entree-naranja-lavado));
}
.jh-pizzas__title_echulada span{
    display:block;
}

.jh-pizzas__grid{
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    flex:1;
    position:relative;
}

.jh-pizzas__grid-photo{
    position:absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    width: 62%;
    max-width: 420px;
    pointer-events:none;
    /* Above cell backgrounds, below cell text */
    z-index: 4;
}
.jh-pizzas__grid-photo img{
    width:100%;
    height:auto;
    display:block;
}
.jh-pizzas__cell{
    padding: 14px 14px;
    display:flex;
    flex-direction:column;
    gap: 8px;
    position:relative;
    /* Put cell content above pizza image */
    z-index: 3;
    background: none !important; /* override any inline background */
}

/* Paint cell background on a layer below the pizza photo */
.jh-pizzas__cell::before{
    content:"";
    position:absolute;
    inset:0;
    background: var(--jh-pz-bg, rgba(23,18,19,0));
    z-index: 1;
}

/* Ensure text is always above the pizza photo */
.jh-pizzas__cell > *{
    position:relative;
    z-index: 3;
}

/* Row helpers (top vs bottom row) */
.jh-pizzas__cell.is-bottom{
    justify-content:flex-end;
    padding-bottom: 18px;
}
.jh-pizzas__cell.is-top{
    justify-content:flex-start;
}
.jh-pizzas__cell:nth-child(1),
.jh-pizzas__cell:nth-child(2),
.jh-pizzas__cell:nth-child(3){
    border-top: 0;
}
.jh-pizzas__cell:nth-child(1),
.jh-pizzas__cell:nth-child(4){
    border-left: 0;
}

.jh-pizzas__cell.is-left{
    text-align:left;
}
.jh-pizzas__cell.is-center{
    text-align:center;
}
.jh-pizzas__cell.is-right{
    text-align:right;
}

.jh-pizzas__cell-name{
    font-family: var(--jh-item-title-font, 'JH_Knockout94', Arial, sans-serif);
    color: #FFFFFF;
    text-transform:uppercase;
    /* font-weight:900; */
    letter-spacing:.5px;
    line-height:.92;
    font-size: 26px;
    display:block;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    overflow-wrap:anywhere;
    word-break:break-word;
}

.jh-pizzas__cell-desc {
    font-family: 'Arial';
    font-weight:600;
    text-transform: uppercase;
    color: var(--jh-pz-cell-text, var(--jh-pz-price, var(--jh-entree-naranja-lavado)));
}

.jh-pizzas__cell-price{
    font-family: 'Arial';
    color: var(--jh-pz-cell-text, var(--jh-pz-price, var(--jh-entree-naranja-lavado)));
    font-weight:600;
    font-size: 16px;
}

.jh-pizzas__bottom{
    background: var(--jh-en-body-bg, var(--jh-entree-rojo-fuerte));
    display:grid;
    grid-template-columns: 42% 58%;
    flex:1;
    min-height: 200px;
}
.jh-pizzas__ench-text{
    padding: 18px 18px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap: 14px;
    color: var(--jh-en-body-color, var(--jh-entree-naranja-lavado));
}
.jh-pizzas__ench-copy{
    font-family: var(--jh-item-desc-font, 'Inter', system-ui, sans-serif);
    text-transform:uppercase;
    font-weight:500;
    font-size: 18px;

    letter-spacing:.6px;
    max-width: 26ch;
}
.jh-pizzas__ench-extra{
    font-family: var(--jh-item-desc-font, 'Inter', system-ui, sans-serif);
    font-weight:600;
    font-size: 20px;
}
.jh-pizzas__ench-photo{
    position:relative;
    overflow:hidden;
}
.jh-pizzas__ench-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

@media (max-width: 860px){


    .jh-pizzas__top--ench .jh-pizzas__title_echulada .jh-pizzas__title-echulada-line--1{
        font-size: clamp(54px, 19vw, 96px);
        text-align: center;
    }

    .jh-pizzas__top--ench .jh-pizzas__title_echulada .jh-pizzas__title-echulada-line--2 {
        font-size: clamp(54px, 19.8vw, 96px);
        text-align: center;
    }


    .jh-pizzas__top {
        padding: 30px 0 30px 0;
        display: block;
    }


    .jh-pizzas__top--pizzas .jh-pizzas__title .jh-pizzas__title-line--1{
        text-align: center;
        font-size: clamp(54px, 41vw, 136vw);
    }

    .jh-pizzas__top--pizzas .jh-pizzas__title .jh-pizzas__title-line--2{
        text-align: center;
        font-size: clamp(54px, 33.3vw, 136vw);
    }
    .jh-pizzas{
        grid-template-columns: 1fr;
    }
    .jh-pizzas__bottom{
        grid-template-columns: 1fr;
    }
    .jh-pizzas__ench-photo{
        min-height: 220px;
    }
    .jh-pizzas__cell-name{
        font-size: 21px;
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
        word-wrap: break-word;
        /* overflow-wrap: break-word; */
        -webkit-hyphens: none;
        -ms-hyphens: none;
        /* hyphens: none; */
        hyphenate-character: "";

    }
    .jh-pizzas__title span{
        display:block;
    }
    .jh-pizzas__cell-desc {
        font-size: 11px;

    }
}