body{
    margin:0;
    padding:0;

    background-color: rgb(255,250,245);

    overflow-x:hidden;
    text-align:center;
}

/* 🔤 FONTOVI */

.script-font{
    font-family:'Great Vibes', cursive;
}

.sans-font{
    font-family:'Anonymous Pro';
}

/* ✨ GOLD */

.gold-text{

    background: linear-gradient(
        90deg,
        #3b3a1a,
        #7a7a3a,
        #c2c27a,
        #7a7a3a,
        #3b3a1a
    );

    background-size:300% 100%;

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    animation:shine 3s linear infinite;
}

/* ✨ ANIMACIJA */

@keyframes shine{

    0%{
        background-position:0%;
    }

    100%{
        background-position:100%;
    }
}

/* 🌸 CVEĆE */

.flower{

    position:fixed;

    top:0;

    height:100vh;

    z-index:-1;

    pointer-events:none;

    opacity:0.85;
}

.flower.left{
    left:-40px;
}

.flower.right{
    right:-40px;
}

/* 📦 GLAVNI WRAPPER */

.seating-wrapper{

    min-height:100vh;

    width:100%;

    display:flex;
    flex-direction:column;

    justify-content:center;
    align-items:center;

    padding:
        clamp(20px,4vw,60px);

    box-sizing:border-box;
}

/* 🏷️ NASLOV */

.big-text{

    width:100%;

    margin:0 auto;

    padding:0 10px;

    font-size:clamp(54px,10vw,130px);

    line-height:1.15;

    overflow:visible;

    text-align:center;
}

/* ✍️ PODNASLOV */

.seating-subtitle{

    margin-top:10px;
    margin-bottom:35px;

    padding:0 15px;

    max-width:700px;

    color:#5a5a2a;

    line-height:1.6;

    font-size:clamp(16px,2vw,24px);
}

/* 🔎 SEARCH */

.search-box{

    width:100%;
    max-width:650px;

    padding:0 10px;

    box-sizing:border-box;
}

.guest-input{

    width:100%;

    padding:18px 24px;

    border:none;
    border-radius:50px;

    background:
        rgba(255,255,255,0.78);

    backdrop-filter:blur(10px);

    font-size:20px;

    text-align:center;

    outline:none;

    transition:0.25s ease;

    box-sizing:border-box;

    box-shadow:
        0 10px 35px rgba(0,0,0,0.08),
        inset 0 1px 0 rgba(255,255,255,0.8);

    border:
        1px solid rgba(122,122,58,0.25);
}

.guest-input:focus{

    border-color:#7a7a3a;

    box-shadow:
        0 0 0 4px rgba(122,122,58,0.12),
        0 10px 35px rgba(0,0,0,0.08);
}

.guest-input::placeholder{

    color:rgba(90,90,42,0.55);
}

/* 📋 REZULTAT */

#rezultat{

    width:100%;
    max-width:650px;

    margin-top:30px;

    padding:0 10px;

    box-sizing:border-box;
}

.result-card{

    width:100%;

    padding:35px 25px;

    border-radius:28px;

    background:
        rgba(255,255,255,0.72);

    backdrop-filter:blur(12px);

    box-sizing:border-box;

    box-shadow:
        0 12px 40px rgba(0,0,0,0.08);

    animation:fadeIn 0.35s ease;
}

.result-name{

    font-size:
        clamp(24px,4vw,40px);

    color:#3b3a1a;

    margin-bottom:20px;

    word-break:break-word;
}

.result-table{

    font-size:
        clamp(38px,7vw,70px);

    font-weight:bold;
}

.not-found{

    width:100%;

    padding:24px;

    border-radius:22px;

    background:
        rgba(255,255,255,0.72);

    color:#5a5a2a;

    box-sizing:border-box;

    font-size:18px;

    animation:fadeIn 0.3s ease;
}

/* ✨ CARD ANIMACIJA */

@keyframes fadeIn{

    from{

        opacity:0;
        transform:translateY(10px);
    }

    to{

        opacity:1;
        transform:translateY(0);
    }
}

/* 📱 TABLET */

@media(max-width:768px){

    .flower{

        height:60vh;

        top:auto;
        bottom:0;

        opacity:0.55;
    }

    .big-text{

        font-size:
            clamp(46px,13vw,90px);
    }

    .guest-input{

        font-size:18px;

        padding:16px 20px;
    }

    .result-card{

        padding:28px 18px;
    }
}

/* 📱 TELEFON */

@media(max-width:480px){

    .seating-wrapper{

        padding:
            25px 15px 40px 15px;
    }

    .big-text{

        font-size:
            clamp(42px,15vw,72px);

        line-height:1.2;
    }

    .seating-subtitle{

        font-size:15px;

        margin-bottom:25px;
    }

    .guest-input{

        font-size:17px;

        border-radius:40px;
    }

    .result-name{

        font-size:32px;
    }

    .result-table{

        font-size:52px;
    }

    .flower{

        height:45vh;

        opacity:0.45;
    }
}