/* ===== Empowered Through Reading — brand tokens ===== */
:root {
    --purple: #6B21A8;
    --purple-deep: #4C1D75;
    --ink: #2B1B3D;
    --orange: #F97316;
    --green: #16A34A;
    --green-deep: #0F7A2E;
    --cream: #FDF8F0;
    --paper: #FBF3E7;
    --line: #EADFCB;
}

body {
    font-family: 'Inter', sans-serif;
    color: var(--ink);
    background-color: var(--cream);
}

h1, h2, h3, .font-display {
    font-family: 'Fraunces', serif;
}

.bg-cream { background-color: var(--cream); }
.bg-paper { background-color: var(--paper); }

.bg-purple { background-color: var(--purple); }
.text-purple { color: var(--purple); }
.bg-orange { background-color: var(--orange); }
.text-orange { color: var(--orange); }
.bg-green { background-color: var(--green); }
.text-green { color: var(--green); }
.text-ink { color: var(--ink); }
.border-line { border-color: var(--line); }

.btn-primary {
    background-color: var(--orange);
    color: white;
    transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease;
}
.btn-primary:hover {
    background-color: #e0670f;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px -8px rgba(249,115,22,.5);
}

.btn-outline {
    border: 2px solid var(--purple);
    color: var(--purple);
    transition: all .25s ease;
}
.btn-outline:hover {
    background-color: var(--purple);
    color: white;
    transform: translateY(-2px);
}

.btn-ghost-white {
    border: 2px solid rgba(255,255,255,.6);
    color: white;
    transition: all .25s ease;
}
.btn-ghost-white:hover {
    background-color: white;
    color: var(--purple);
}

.card-shadow {
    box-shadow: 0 20px 40px -20px rgba(43,27,61,.18);
}

.floating {
    animation: floating 4s ease-in-out infinite;
}
@keyframes floating {
    0%   { transform: translate(0, 0); }
    50%  { transform: translate(0, 10px); }
    100% { transform: translate(0, 0); }
}

/* subtle adire-inspired dot-arc divider pattern */
.pattern-divider {
    background-image: radial-gradient(var(--purple) 1.6px, transparent 1.6px);
    background-size: 18px 18px;
    opacity: .12;
}

.step-line {
    background: linear-gradient(90deg, var(--purple), var(--orange), var(--green));
}

.numeral {
    font-family: 'Fraunces', serif;
    font-variant-numeric: oldstyle-nums;
    color: rgba(107,33,168,0.18);
}

.section-eyebrow {
    letter-spacing: .18em;
}

::selection {
    background: var(--orange);
    color: white;
}

/* focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible {
    outline: 3px solid var(--orange);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .floating, .btn-primary, .btn-outline { animation: none !important; transition: none !important; }
}

/* ===== Hero full-width slider ===== */
.hero-slider-wrap {
    position: relative;
    width: 100%;
    min-height: 620px;
    overflow: hidden;
}
@media (max-width: 767px) {
    .hero-slider-wrap { min-height: 640px; }
}
.hero-slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1.6s ease-in-out;
}
.hero-slide.is-active {
    opacity: 1;
}
/* dim toward the left (text side), brighter toward the right */
.hero-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(36, 24, 52, .93) 0%,
        rgba(36, 24, 52, .82) 22%,
        rgba(36, 24, 52, .55) 45%,
        rgba(36, 24, 52, .22) 68%,
        rgba(36, 24, 52, .05) 100%);
}
@media (max-width: 767px) {
    /* on small screens dim more broadly so text stays readable above a stacked layout */
    .hero-gradient {
        background: linear-gradient(180deg,
            rgba(36, 24, 52, .55) 0%,
            rgba(36, 24, 52, .78) 45%,
            rgba(36, 24, 52, .93) 100%);
    }
}
.hero-content {
    position: relative;
    z-index: 10;
}

/* ===== Photo + logo badge overlay (Our Mission) ===== */
.photo-frame {
    position: relative;
    border-radius: 1.25rem;
    overflow: hidden;
}
.logo-badge {
    position: absolute;
    left: 1.25rem;
    bottom: -1.5rem;
    background: #FFFFFF;
    border-radius: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1.1rem;
    max-width: 82%;
}

/* ===== News / blog cards ===== */
.news-icon-tile {
    height: 11rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ===== Resource download cards (resources.html) ===== */
.resource-card {
    transition: transform .25s ease, box-shadow .25s ease;
}
.resource-card:hover {
    transform: translateY(-4px);
}

/* ===== How We Advance Opportunities — editorial tile grid ===== */
.bg-ink { background-color: var(--ink); }
.advance-tile {
    transition: transform .25s ease, box-shadow .25s ease;
}
.advance-tile:hover {
    transform: translateY(-4px);
}
.advance-tile-number {
    position: absolute;
    top: 0.5rem;
    right: 1.5rem;
    font-family: 'Fraunces', serif;
    font-size: 3.5rem;
    font-weight: 600;
    opacity: 0.1;
    line-height: 1;
    pointer-events: none;
}
