/* Financial Times — Salmon-pink broadsheet with teal accents */

@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400&display=swap');

:root {
    --font-headline: 'Raleway', sans-serif;
    --font-body: 'Raleway', sans-serif;
    --font-sans: 'Raleway', sans-serif;
    --color-ink: #1a1a1a;
    --color-paper: #f5f5f7;
    --color-rule: #ccc1b7;
    --color-rule-light: #e8ddd3;
    --color-accent: #0d7680;
    --color-muted: #66605c;
}

body { background: var(--color-paper); color: var(--color-ink); }
a { color: var(--color-ink); }
a:hover { color: var(--color-accent); }

/* Masthead */
.masthead {
    background: #262a33;
    background-image:
        linear-gradient(rgba(13,118,128,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(13,118,128,0.04) 1px, transparent 1px);
    background-size: 60px 25px;
    border-bottom: 1px solid #0d7680;
    position: relative;
    overflow: hidden;
}
.masthead .container { position: relative; z-index: 1; }

/* Stock Ticker — two seamless scrolling chart layers */
.masthead::before,
.masthead::after {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 200vw;
    height: 100%;
    background-repeat: repeat-x;
    background-size: 100vw 100%;
    pointer-events: none;
}
.masthead::before {
    opacity: 0.22;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='120' viewBox='0 0 800 120' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%230d7680' stop-opacity='0.5'/%3E%3Cstop offset='100%25' stop-color='%230d7680' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon points='0,120 0,55 30,48 60,55 90,42 120,50 150,35 180,45 210,30 240,40 270,25 300,35 330,20 360,32 390,40 420,28 450,38 480,48 510,35 540,42 570,30 600,40 630,50 660,38 690,45 720,35 750,48 780,52 800,55 800,120' fill='url(%23a)'/%3E%3Cpolyline points='0,55 30,48 60,55 90,42 120,50 150,35 180,45 210,30 240,40 270,25 300,35 330,20 360,32 390,40 420,28 450,38 480,48 510,35 540,42 570,30 600,40 630,50 660,38 690,45 720,35 750,48 780,52 800,55' fill='none' stroke='%230d7680' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
    animation: ft-ticker-1 18s linear infinite;
}
.masthead::after {
    opacity: 0.12;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='120' viewBox='0 0 800 120' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='b' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%230d7680' stop-opacity='0.4'/%3E%3Cstop offset='100%25' stop-color='%230d7680' stop-opacity='0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpolygon points='0,120 0,45 35,55 65,40 100,50 130,35 165,45 195,28 230,40 260,50 295,38 325,48 360,30 390,42 425,52 455,38 490,48 520,32 555,42 585,55 620,42 650,50 685,38 715,48 750,40 780,48 800,45 800,120' fill='url(%23b)'/%3E%3Cpolyline points='0,45 35,55 65,40 100,50 130,35 165,45 195,28 230,40 260,50 295,38 325,48 360,30 390,42 425,52 455,38 490,48 520,32 555,42 585,55 620,42 650,50 685,38 715,48 750,40 780,48 800,45' fill='none' stroke='%230d7680' stroke-width='1.5' stroke-linejoin='round' stroke-dasharray='6 4'/%3E%3C/svg%3E");
    animation: ft-ticker-2 13s linear infinite;
}
@keyframes ft-ticker-1 {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100vw); }
}
@keyframes ft-ticker-2 {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100vw); }
}
@media (prefers-reduced-motion: reduce) {
    .masthead::before, .masthead::after { animation: none; }
}
.masthead-title a { color: #f5f5f7 !important; }
.masthead-subtitle { color: #9bb0b1; }
.masthead-date { color: #9ba5a5; }

/* Nav */
.category-nav { background: #262a33; }
.category-nav .cat-link, .category-nav .nav-link { color: #d4cec5; }
.category-nav .cat-link:hover, .category-nav .nav-link:hover, .category-nav .cat-link.active, .category-nav .nav-link.active { color: #fff; background: rgba(13,118,128,0.25); }

/* Lead */
.lead-headline { font-family: 'Raleway', sans-serif; }
.lead-headline a { color: var(--color-ink); }
.lead-headline a:hover { color: var(--color-accent); }
.lead-summary { color: #4a4540; }
.lead-article { border-color: var(--color-rule); }

/* Sidebar */
.sidebar-story { border-color: var(--color-rule-light); }
.sidebar-headline a { color: var(--color-ink); }
.sidebar-headline a:hover { color: var(--color-accent); }
.sidebar-summary { color: #66605c; }

/* Grid */
.grid-article { border-color: var(--color-rule-light); border-radius: 0; }
.grid-headline a { color: var(--color-ink); }
.grid-headline a:hover { color: var(--color-accent); }
.grid-summary { color: #66605c; }
.grid-category { color: var(--color-accent); }
.section-label { color: var(--color-accent); }
.section-rule { border-color: var(--color-rule); }

/* Article page */
.article-page-headline { color: var(--color-ink); }
.article-page-summary { color: #4a4540; }
.article-content { color: #33302b; }
.article-content blockquote { border-color: var(--color-accent); color: #66605c; }
.article-disclaimer { border-color: var(--color-rule-light); color: var(--color-muted); }

/* Newsletter box */
.newsletter-box, .newsletter-optin { background: #0d7680; }
.newsletter-box .btn, .newsletter-optin .btn { background: #f5f5f7; color: #0d7680; border: none; }
.newsletter-box .btn:hover, .newsletter-optin .btn:hover { background: #fff; }

/* Pagination */
.pagination .page-link { background: #ffffff; border-color: var(--color-rule-light); color: var(--color-ink); }
.pagination .active .page-link { background: var(--color-accent); border-color: var(--color-accent); color: #fff; }
.pagination .page-link:hover { background: #f5e6d8; }

/* Footer */
.newspaper-footer { background: #262a33; border-top: 1px solid #0d7680; }
.breadcrumb-item a { color: var(--color-accent); }
.breadcrumb-item.active { color: var(--color-muted); }