@import "./base/reset.css";
@import "./base/variables.css";
@import "./base/global.css";

@import "./components/navbar.css";
@import "./components/button.css";

@import "./pages/home.css";

/* Global theme adjusted to match Sense Concept: dark gray background, yellow accents */
body {
    background-color: #333333;
    color: #ffffff;
    font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
    padding: 32px 0 0 0;
    margin: 0;
}

:root{
  --text:#ffffff;
  --muted:#b0b0b0;
  --border: rgba(255,215,0,0.1);
}

.title {
    color: var(--text);
    font-family: 'Playfair Display', serif;
    font-size: 28px;
    margin: 24px 0;
}

.lead{color:var(--muted);margin-top:8px}

.card {
    margin-top: 20px;
    padding: 20px;
    border-radius: 6px;
    background-color: #ffffff;
    border: 1px solid var(--border);
    box-shadow: 0 6px 18px rgba(11,18,32,0.04);
    color: var(--text);
}

/* Ensure header links are uppercase and black (navbar.css covers typography) */
a{color:var(--text);text-decoration:none}

/* Utility container similar to prior .container usage */
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* Footer subtle */
.site-footer{padding:36px 0 80px;text-align:center;color:var(--muted)}

/* Tighten page-wide margins to match sample (large whitespace from edges)
     Use a larger page container for header + gallery */
@media(min-width:1300px){
    .container{max-width:1400px}
}

/* subtle link hover */
.nav a:hover{opacity:.85}

/* Ticker / marquee under footer */
.ticker-wrap{overflow:hidden;background:transparent;padding:20px 0 40px 0}
.ticker{display:flex;align-items:center}
:root{--ticker-gap:36px}
.ticker__inner{display:flex;white-space:nowrap;gap:var(--ticker-gap);animation:marquee 28s linear infinite;padding:0 calc(var(--ticker-gap) / 2)}
.ticker__item{color:#FFD700;font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:2px;text-transform:capitalize;padding:0 6px}

@keyframes marquee{
    0%{transform:translateX(-50%)}
    100%{transform:translateX(0)}
}

@media(prefers-reduced-motion:reduce){
    .ticker__inner{animation:none}
}