/*=========================================================
    SIMON HERO ENTERPRISE V10
    DPMD KABUPATEN KUDUS
=========================================================*/



.simon-hero > .simon-card{
    position:relative;
    z-index:3;
}


/*======================================
BACKGROUND PREMIUM
======================================*/

/*=========================================================*
* BACKGROUND HERO - PUTIH BERSIH
*=========================================================*/

/*=========================================================*
 * SIMON DPMD KUDUS
 * HERO ENTERPRISE
 *=========================================================*/

.simon-hero{
    position:relative;

    margin-bottom:30px;

    background:#ffffff;

    overflow:hidden;

    border-radius:32px;
}


/*=========================================================*
 * BACKGROUND PUTIH
 *=========================================================*/

.simon-bg-gradient{

    position:absolute;

    inset:0;

    border-radius:32px;

    background:#ffffff;

    opacity:1;

    pointer-events:none;

    z-index:0;
}




/*======================================
DOTS
======================================*/

.simon-bg-dots{
    position:absolute;

    top:25px;
    left:25px;

    width:100px;
    height:100px;

    background-image:
        radial-gradient(
            circle,
            #0d6efd 2px,
            transparent 2px
        );

    background-size:18px 18px;

    opacity:.55;

    z-index:2;

    pointer-events:none;
}

/*======================================
LOGO
======================================*/


/*=========================================================*
 * LOGO KUDUS
 *=========================================================*/

.simon-logo-wrapper{

    position:relative;

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:220px;
}


.simon-logo-wrapper::before{

    content:"";

    position:absolute;

    width:190px;

    height:190px;

    border-radius:50%;

    background:

        radial-gradient(
            rgba(13,110,253,.15),
            transparent 70%
        );

    filter:blur(12px);
}


.simon-logo{

    position:relative;

    width:120px;

    max-width:100%;

    z-index:2;
}


@keyframes logoGlow{

0%{

transform:scale(1);

}

50%{

transform:scale(1.15);

}

100%{

transform:scale(1);

}

}

/*=========================================================
  SIMON V10
  CONTENT LAYER
=========================================================*/

.simon-card > .container-fluid{

    position:relative;

    z-index:5;

}


/*=========================================================
  SUBTITLE
=========================================================*/

/*=========================================================*
 * SIMON DPMD
 *=========================================================*/

.simon-subtitle{
    position:relative;
    display:inline-block;
    margin-bottom:8px;
    color:#0d6efd;
    font-size:16px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
}


.simon-title{

    margin:0 0 10px 0;

    font-size:52px;

    line-height:0.7;

    font-weight:800;

    letter-spacing:-1px;

    color:#173f91;

    position:relative;

    z-index:6;
}


.simon-title span{

    color:#0d6efd;
}


/*=========================================================*
 * DESKRIPSI SIMON
 *=========================================================*/

.simon-text{
    margin-bottom:5px;

    color:#1f2937;

    font-size:18px;

    font-weight:500;

    line-height:1.5;
}


.simon-bold{
    font-weight:600;
    color:#1769d1;
    font-size:19px;
}


/*=========================================================*
 * KABUPATEN KUDUS
 *=========================================================*/

.simon-small{
    margin-top:5px;

    color:#1f2937;

    font-size:16px;

    font-weight:500;
}
/*=========================================================
  CLOCK CARD
=========================================================*/
/*=========================================================*
 * CLOCK CARD
 *=========================================================*/

.simon-clock-card{

    position:relative;

    padding:20px 22px;

    text-align:center;

    border-radius:24px;

    background:rgba(255,255,255,.92);

    border:1px solid rgba(13,110,253,.10);

    box-shadow:

        0 12px 30px rgba(25,70,130,.10);

    backdrop-filter:blur(12px);

    z-index:6;
}


.simon-clock-top{

    position:relative;

    z-index:2;
}


.simon-clock-card .badge{

    font-size:12px;

    font-weight:600;

    box-shadow:

        0 5px 15px rgba(25,135,84,.18);
}


.simon-jam{

    margin-top:12px;

    color:#0d6efd;

    font-size:43px;

    line-height:1.1;

    font-weight:800;

    letter-spacing:1px;

    font-variant-numeric:tabular-nums;
}


.simon-tanggal{

    margin-top:8px;

    color:#687586;

    font-size:15px;

    font-weight:500;
}


.simon-update{

    color:#8994a3;

    font-size:12px;
}


.simon-lastupdate{

    margin-top:3px;

    color:#526273;

    font-size:13px;

    font-weight:600;
}

/*=========================================================*
 * CONTENT LAYER
 *=========================================================*/

.simon-card{

    position:relative;

    z-index:3;
}


.simon-card > .container-fluid{

    position:relative;

    z-index:5;
}


.simon-logo-wrapper,
.simon-subtitle,
.simon-title,
.simon-text,
.simon-bold,
.simon-small,
.simon-clock-card{

    position:relative;

    z-index:6;
}




/*=========================================================*
 * WATERMARK MENARA KUDUS
 * POSISI: DALAM HERO, SEBELAH KIRI KARTU JAM
 *=========================================================*/

.simon-watermark{
    position:absolute !important;

    right:470px !important;
    top:0px !important;

    width:300px !important;
    height:290px !important;

    opacity:.35 !important;

    z-index:10 !important;

    display:block !important;

    pointer-events:none;

    object-fit:contain;
}
.simon-hero .simon-card > .container-fluid{

    position:relative;

    z-index:5;

}

.simon-logo-wrapper,
.simon-subtitle,
.simon-title,
.simon-text,
.simon-small,
.simon-clock-card{

    position:relative;

    z-index:6;

}

