/* ============================================================
   ROOT VARIABLES
============================================================ */
:root{
    --rg-dark-blue:#002b5c;
    --rg-gold:#d4af37;
    --rg-white:#ffffff;
    --rg-shadow-wide:0 8px 28px rgba(0,0,0,0.22);
}

/* ============================================================
   FIXED IDENTITY BLOCK
============================================================ */
.rg-identity-block{
    position:fixed;
    top:0; left:0; right:0;
    z-index:3000;
    box-shadow:var(--rg-shadow-wide);
}

/* ============================================================
   TOPBAR
============================================================ */
.rg-topbar{
    background:var(--rg-dark-blue);
    color:var(--rg-gold);
    height:45px;
    display:flex;
    align-items:center;
    border-top-left-radius:14px;
    border-top-right-radius:14px;
}

.rg-topbar a{
   color:var(--rg-gold);
   }

.rg-topbar-inner{
    max-width:1200px;
    margin:0 auto;
    padding:0 18px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.rg-topbar-left{
    display:flex;
    align-items:center;
    gap:22px; /* Website → Phone */
}

.rg-topbar-item{
    font-size:15px;
    font-weight:700;
    color:var(--rg-gold);
    letter-spacing:0.03em;
    white-space:nowrap;
}

/* FIXED: Phone → Facebook spacing */
.rg-topbar-right{
    display:flex;
    align-items:center;
    gap:22px; /* Now matches left side spacing */
}

.rg-social-icon{
    color:var(--rg-gold);
    text-decoration:none;
    font-size:16px;
    font-weight:700;
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition:opacity 0.2s ease;
}

.rg-social-icon:hover{
    opacity:0.75;
}

/* ============================================================
   GOLD NAVBAR
============================================================ */
.rg-navbar{
    background:var(--rg-gold);
    height:150px;
    display:flex;
    align-items:center;
}

.rg-navbar-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
}

/* LEFT: LOGO + BRAND */
.rg-identity-left{
    display:flex;
    align-items:center;
    gap:14px;
    padding-left:18px;
}

.rg-navbar-logo img{
    height:120px;
    width:auto;
    border-radius:14px;
    padding:6px;
    background:radial-gradient(circle,
        rgba(212,175,55,0.25),
        rgba(212,175,55,0.05),
        transparent);
}

/* BRAND BLOCK */
.rg-brand-block{
    display:flex;
    flex-direction:column;
}

.rg-brand-line-1{
    font-size:34px;
    font-weight:900;
    color:var(--rg-dark-blue);
}

.rg-brand-line-2{
    font-size:20px;
    font-weight:700;
    background:var(--rg-dark-blue);
    color:#fff;
    padding:6px 14px;
    border-radius:8px;
    margin-top:4px;
    white-space:nowrap;
}

/* ============================================================
   NAVIGATION — TWO ROWS
============================================================ */
.rg-navbar-center{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.rg-navbar-links{
    display:flex;
    align-items:center;
}

/* ROW 1 — Original links */
.rg-nav-row-1{
    display:flex;
    gap:28px;
    margin-bottom:6px;
}

/* ROW 2 — Capsule links */
.rg-nav-row-2{
    display:flex;
    gap:14px;
    margin-top:4px;
}

.rg-nav-link{
    text-decoration:none;
    color:var(--rg-dark-blue);
    font-weight:700;
    font-size:15px;
    padding:6px 4px;
    border-bottom:3px solid transparent;
}

.rg-nav-link:hover{
    border-bottom-color:var(--rg-dark-blue);
}

/* CAPSULE LINKS */
.rg-nav-pill{
    background:#002b5c;
    color:#fff !important;
    padding:6px 12px;
    border-radius:12px;
    font-weight:800;
    transition:0.2s ease;
}

.rg-nav-pill:hover{
    background:#001d3f;
}

/* ============================================================
   RIGHT: HALLMARK
============================================================ */
.rg-identity-right{
    padding-right:2%;
}

.rg-navbar-hallmark img{
    height:120px;
    width:auto;
    border-radius:14px;
    padding:6px;
    background:radial-gradient(circle,
        rgba(212,175,55,0.25),
        rgba(212,175,55,0.05),
        transparent);
    filter:
        drop-shadow(0 0 8px rgba(212,175,55,0.45))
        drop-shadow(0 0 14px rgba(0,0,0,0.35));
}

/* ============================================================
   MOTTO PANEL — CENTERED + SHIMMER + DATE/TIME RIGHT
============================================================ */
.rg-motto-banner{
    width:100%;
    padding:8px 0 6px;
    display:flex;
    align-items:center;
    position:relative;

    background:linear-gradient(90deg,
        #006b3f 0%,
        #f28e1c 40%,
        #000000 70%,
        #ef3340 100%
    );
}

/* Motto capsule centered */
.rg-motto-inner{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    background:#002b5c;
    padding:8px 20px;
    border-radius:12px;
    box-shadow:0 4px 12px rgba(0,0,0,0.15);
}

/* Shimmer text */
.rg-motto-text{
    font-size:20px;
    font-weight:800;
    letter-spacing:0.04em;
    text-transform:uppercase;

    background:linear-gradient(90deg,
        #ffffff 0%,
        #d4af37 25%,
        #ffffff 50%,
        #d4af37 75%,
        #ffffff 100%
    );
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;

    animation:rgMottoShimmer 10s linear infinite;
}

@keyframes rgMottoShimmer{
    0%{background-position:-500px 0;}
    100%{background-position:500px 0;}
}

/* Date/time right aligned */
.rg-motto-datetime{
    margin-left:auto;
    padding-right:18px;
    color:#fff;
    font-weight:700;
    font-size:14px;
    opacity:0.9;
}

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 560px){

    .rg-navbar-center{
        flex-direction:column;
    }

    .rg-nav-row-1,
    .rg-nav-row-2{
        flex-wrap:wrap;
        justify-content:center;
    }

    .rg-motto-banner{
        flex-direction:column;
        gap:6px;
    }

    .rg-motto-inner{
        position:static;
        transform:none;
    }

    .rg-motto-datetime{
        margin-left:0;
        padding-right:0;
    }
}