/*
--------------------------------------------------------
Papa Cupom CMS
Arquivo: style.css
Função: Estilos globais
--------------------------------------------------------
*/

:root{

    --primary:#2563eb;
    --primary-dark:#1d4ed8;

    --sidebar:#1f2937;
    --sidebar-hover:#374151;

    --background:#f3f4f6;

    --card:#ffffff;

    --text:#111827;

    --border:#e5e7eb;

    --success:#16a34a;

    --danger:#dc2626;

    --warning:#f59e0b;

    --radius:12px;

}

body{

    margin:0;

    background:var(--background);

    color:var(--text);

    font-family:
    "Segoe UI",
    Arial,
    sans-serif;

}

.card{

    border:none;

    border-radius:var(--radius);

    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.btn-primary{

    background:var(--primary);

    border:none;

}

.btn-primary:hover{

    background:var(--primary-dark);

}

/* Header */

.header{
    background:#FFFFFF;
    border-bottom:1px solid #E5E7EB;
    position:sticky;
    top:0;
    z-index:1000;
}

.header .container{
    max-width:1400px;
    margin:0 auto;
    padding:18px 20px;
    display:flex;
    align-items:center;
    gap:24px;
}

.logo img{
    height:42px;
}

.search-form{
    flex:1;
    display:flex;
    border:2px solid #16A34A;
    border-radius:14px;
    overflow:hidden;
    background:#FFF;
}

.search-form input{
    flex:1;
    border:none;
    outline:none;
    padding:14px 18px;
    font-size:15px;
}

.search-form button{
    width:60px;
    border:none;
    background:#16A34A;
    color:#FFF;
    cursor:pointer;
    font-size:18px;
}

.menu{
    display:flex;
    gap:24px;
}

.menu a{
    text-decoration:none;
    color:#374151;
    font-weight:600;
}

.menu a:hover{
    color:#16A34A;
}

.btn-login{
    background:#16A34A;
    color:#FFF;
    text-decoration:none;
    padding:12px 22px;
    border-radius:10px;
    font-weight:700;
}

.btn-login:hover{
    background:#15803D;
}

/* Hero */

.hero{
    padding:80px 0;
    background:#F8FAFC;
}

.hero .container{
    max-width:1400px;
    margin:0 auto;
    padding:0 20px;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:60px;
}

.hero-badge{
    display:inline-block;
    background:#DCFCE7;
    color:#15803D;
    padding:10px 18px;
    border-radius:999px;
    font-weight:700;
    margin-bottom:25px;
}

.hero h1{
    font-size:56px;
    line-height:1.15;
    margin-bottom:25px;
    color:#111827;
}

.hero p{
    font-size:20px;
    color:#6B7280;
    margin-bottom:35px;
}

.hero-search{
    display:flex;
    background:#FFF;
    border-radius:16px;
    overflow:hidden;
    border:2px solid #16A34A;
    margin-bottom:40px;
}

.hero-search input{
    flex:1;
    border:none;
    outline:none;
    padding:18px;
    font-size:16px;
}

.hero-search button{
    width:170px;
    background:#16A34A;
    color:#FFF;
    border:none;
    cursor:pointer;
    font-size:16px;
    font-weight:700;
}

.hero-search button:hover{
    background:#15803D;
}

.hero-stats{
    display:flex;
    gap:50px;
}

.hero-stats strong{
    display:block;
    font-size:34px;
    color:#16A34A;
}

.hero-stats span{
    color:#6B7280;
}

.hero-right img{
    width:100%;
    max-width:600px;
}