/* ================================================
   CSS CUSTOM PROPERTIES
   ================================================ */
:root {
   --navy: #10295C;
   --sky: #c2cde6;
   --navy-deep: #0A1B40;
   --royal: #22479E;
   --royal-soft: #E9EDF8;
   --red: #ff3840;
   --red-deep: #B0161C;
   --red-soft: #FBE6E2;
   --gold: #EAA21C;
   --gold-deep: #C5851A;
   --gold-soft: #FBEFCE;
   --paper: #FAF6ED;
   --paper-2: #F2ECDC;
   --white: #FFFFFF;
   --ink: #15233F;
   --ink-soft: #5A6378;
   --line: #E7DFCC;
   --shadow: 0 22px 48px -26px rgba(16, 41, 92, .4);
   --shadow-sm: 0 10px 24px -16px rgba(16, 41, 92, .5);
   --r: 20px;
   --maxw: 1180px;
}
/* ================================================
   BUTTONS
   ================================================ */
.btn { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .98rem; padding: .82rem 1.4rem; border-radius: 999px; cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s, color .15s; }
.btn svg { width: 17px; height: 17px; }

.btn-red { background: var(--red); color: #fff; box-shadow: var(--shadow-sm); }
.btn-red:hover { background: var(--red-deep); color: var(--white); transform: translateY(-2px); }
.btn-red-outline { border-color: var(--red); color: var(--red-deep); }
.btn-red-outline:hover { border-color: var(--red); color: var(--red-deep); }

.btn-navy { background: var(--navy); color: #fff; box-shadow: var(--shadow-sm); }
.btn-navy:hover { background: var(--navy-deep); color: var(--white); transform: translateY(-2px); }
.btn-navy-outline { border-color: var(--navy); color: var(--navy-deep); }

.btn-gold { background: var(--gold); color: #2a1c02; }
.btn-gold:hover { background: var(--gold-deep); transform: translateY(-2px); }
.btn-gold-outline { border-color: var(--gold); color: var(--gold-deep); }
.btn-gold-outline:hover { border-color: var(--red); color: var(--red-deep); }

.btn-ghost-light { border-color: rgba(255,255,255,.55); color: #fff; }
.btn-ghost-light:hover { background: rgba(255,255,255,.14); }
.under-construction {
   background: linear-gradient(135deg, var(--royal-soft) 0%, #fff 55%, var(--gold-soft) 100%);
}

.uc-social a {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   border: 1px solid var(--line);
   color: var(--navy);
   background: #fff;
   transition: background .15s, color .15s, transform .15s;
}

.uc-social a:hover {
   background: var(--navy);
   color: #fff;
   transform: translateY(-3px);
}

/* ================================================
   FLOATING ILLUSTRATION
   ================================================ */
.uc-float {
   animation: ucFloat 6s ease-in-out infinite;
}
@keyframes ucFloat {
   0%   { transform: translateY(0px); }
   22%  { transform: translateY(-16px); }
   48%  { transform: translateY(5px); }
   74%  { transform: translateY(-9px); }
   100% { transform: translateY(0px); }
}
@media (prefers-reduced-motion: reduce) {
   .uc-float { animation: none; }
}