/* Ocean imagery and blue/teal accents for the two home screens. */
.landing-page .hero { text-align:left; place-items:center start; }
.landing-page .hero-image { object-position:center 58%; animation:none; }
.landing-page .hero-veil { background:linear-gradient(90deg,rgba(3,29,54,.88) 0%,rgba(3,42,65,.70) 40%,rgba(4,52,74,.12) 78%),linear-gradient(0deg,rgba(3,29,54,.20),transparent 65%); }
.landing-page .hero-content { align-items:flex-start; width:min(960px,100%); padding:clamp(32px,7vw,110px); gap:36px; }
.landing-page .hero-brand-title { font-family:Arial,Helvetica,sans-serif; font-size:clamp(3rem,7.5vw,7rem); line-height:1.08; letter-spacing:-.045em; font-weight:700; max-width:9ch; text-shadow:0 4px 24px rgba(0,21,42,.25); }
.landing-page .hero-ctas { justify-content:flex-start; gap:16px; }
.landing-page .hero-ctas .btn { min-width:170px; min-height:52px; padding:15px 26px; border-radius:6px; font-family:Arial,Helvetica,sans-serif; font-size:16px; font-weight:700; letter-spacing:.035em; text-decoration:none; }
.landing-page .hero-ctas .btn-primary { color:#052c45; background:#68e0de; border:2px solid #68e0de; box-shadow:0 8px 22px rgba(0,30,48,.18); }
.landing-page .hero-ctas .btn-ghost { color:white; background:rgba(5,35,56,.25); border:2px solid rgba(255,255,255,.85); }
.landing-page .hero-ctas .btn-primary:hover { color:#052c45; background:#9af0ed; border:2px solid #9af0ed; box-shadow:0 8px 22px rgba(0,30,48,.18); text-decoration:none; }
.landing-page .hero-ctas .btn-ghost:hover { color:#052c45; background:white; border:2px solid white; text-decoration:none; }
.landing-page .hero-ctas .btn:focus-visible { outline:3px solid white; outline-offset:5px; }
.ocean-dashboard { background:#edf5fa; }
.ocean-dashboard .topbar { min-height:0; padding:12px 24px; border-radius:14px; background:linear-gradient(90deg,rgba(5,42,70,.94),rgba(6,55,75,.66)),url("images/wave1.jpg") center 58%/cover; box-shadow:0 10px 28px rgba(10,57,79,.12); }
.ocean-dashboard .topbar h2 { color:white; }
.ocean-dashboard .topbar p,.ocean-dashboard .user-profile>div span { color:#d1eeee; }
.ocean-dashboard .user-profile strong { color:white; }
.ocean-dashboard .user-avatar { background:#68e0de; color:#052c45; }
.ocean-dashboard .summary-card:nth-child(1) { background:#e7f3ff; border-left-color:#246cb0; }
.ocean-dashboard .summary-card:nth-child(2) { background:#e7fafc; border-left-color:#0b91ad; }
.ocean-dashboard .summary-card.warning { background:#fff5e7; border-left-color:#d49224; }
.ocean-dashboard .summary-card.savings { background:#e5f7ef; border-left-color:#1a8b6a; }
.ocean-dashboard .card-label { color:#3c5d70; }
.ocean-dashboard .summary-card small { color:#506a78; }
@media(max-width:760px) {
 .landing-page .hero-veil { background:linear-gradient(90deg,rgba(3,29,54,.82),rgba(3,42,65,.40)),linear-gradient(0deg,rgba(3,29,54,.45),transparent 75%); }
 .landing-page .hero-content { padding:32px 24px; gap:28px; }
 .landing-page .hero-brand-title { font-size:clamp(3rem,12vw,5rem); }
 .landing-page .hero-ctas { flex-direction:column; width:min(280px,100%); align-items:stretch; }
 .landing-page .hero-ctas .btn { width:100%; }
 .ocean-dashboard .topbar { min-height:0; padding:12px 16px; gap:12px; }
 .ocean-dashboard .user-profile { flex-wrap:wrap; max-width:100%; }
}