/* Orlando theme: deep teal and sunshine gold across every public page. Loaded after the built CSS. */

section.bg-primary-dark,
.bg-primary-dark.isolate { background-color: var(--brand-secondary); }

/* Heroes: solid teal behind the text, the photo clear on the right. */
.hero-overlay {
    background:
        linear-gradient(90deg,
            color-mix(in srgb, var(--brand-secondary) 97%, transparent) 0%,
            color-mix(in srgb, var(--brand-secondary) 90%, transparent) 45%,
            color-mix(in srgb, var(--brand-secondary) 28%, transparent) 72%,
            color-mix(in srgb, var(--brand-secondary) 8%, transparent) 100%),
        linear-gradient(0deg, color-mix(in srgb, var(--brand-secondary) 60%, transparent) 0%, transparent 35%);
}
.hero-blob,
section > svg.text-page { display: none; }

/* Home hero: two lines of headline, without the tagline badge. */
.home-hero .eyebrow-light { display: none; }
.home-hero .hero-overlay {
    background:
        linear-gradient(90deg,
            color-mix(in srgb, var(--brand-secondary) 98%, transparent) 0%,
            color-mix(in srgb, var(--brand-secondary) 96%, transparent) 50%,
            color-mix(in srgb, var(--brand-secondary) 25%, transparent) 70%,
            color-mix(in srgb, var(--brand-secondary) 5%, transparent) 100%),
        linear-gradient(0deg, color-mix(in srgb, var(--brand-secondary) 60%, transparent) 0%, transparent 35%);
}
.home-hero h1 { max-width: 54rem; font-size: clamp(2.25rem, 4.6vw, 4rem); }

/* Author page: a short hero with the airport behind it, and the bio in a card below. */
.author-hero .container-site { padding-bottom: 6rem; }
.author-hero-avatar { box-shadow: 0 0 0 4px var(--brand-accent), 0 18px 40px -12px rgb(0 0 0 / .55); }
.author-about { position: relative; z-index: 1; margin-top: -3.5rem; }
.author-about-card {
    position: relative;
    display: grid;
    gap: 2rem;
    overflow: hidden;
    padding: 1.75rem;
    border: 1px solid var(--color-line, #e2e8f0);
    border-radius: 1.5rem;
    background: #fff;
    box-shadow: 0 24px 50px -28px rgb(15 23 42 / .45);
}
.author-about-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, var(--brand-accent), var(--brand-primary));
}
.author-about-bio h2 {
    margin: 0;
    color: var(--brand-secondary);
    font-size: 1.625rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.01em;
}
.author-about-lead {
    margin-top: 1rem;
    color: var(--brand-secondary);
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.6;
}
.author-about-rest {
    margin-top: 1.25rem;
    color: color-mix(in srgb, var(--brand-text) 85%, white);
    font-size: 1rem;
    line-height: 1.8;
}
.author-about-facts {
    align-self: start;
    padding: 1.5rem;
    border-radius: 1.25rem;
    background: var(--brand-secondary);
    color: #fff;
}
.author-about-facts dl { display: grid; gap: 1.125rem; margin: 0; }
.author-about-facts dl > div + div { padding-top: 1.125rem; border-top: 1px solid rgb(255 255 255 / .14); }
.author-about-facts dt { display: flex; align-items: center; gap: .5rem; color: rgb(255 255 255 / .75); font-size: .8125rem; font-weight: 500; }
.author-about-facts dt svg { color: var(--brand-accent); }
.author-about-facts dd { margin: .25rem 0 0; font-size: 1.0625rem; font-weight: 600; line-height: 1.4; }
.author-about-facts .author-about-count { color: var(--brand-accent); font-size: 2.5rem; font-weight: 700; line-height: 1.1; }
.author-about-facts a { color: #fff; text-decoration: underline; text-decoration-color: var(--brand-accent); text-underline-offset: 3px; }
.author-about-facts a:hover { color: var(--brand-accent); }
@media (min-width: 1024px) {
    .author-about-card { grid-template-columns: minmax(0, 1fr) 20rem; gap: 3rem; padding: 2.5rem; }
}
@media (min-width: 1280px) {
    .author-about-rest { columns: 2; column-gap: 2.5rem; }
}

/* Blog header. */
section.from-primary-soft.via-white { background: var(--brand-secondary); border-color: transparent; }
section.from-primary-soft.via-white h1 { color: #fff; }
section.from-primary-soft.via-white .text-muted { color: rgb(255 255 255 / .8); }

/* Soft frame behind content photos. */
.-inset-3.from-primary-soft { background: color-mix(in srgb, var(--brand-accent) 18%, white); }

/* Newsletter: teal band with a gold button. */
footer .bg-gradient-to-br.from-primary-dark {
    background: linear-gradient(120deg, color-mix(in srgb, var(--brand-primary) 72%, black), color-mix(in srgb, var(--brand-primary) 88%, black));
}
footer h4 + .bg-accent { background: var(--brand-accent); }
footer a svg { color: var(--brand-accent); }

/* Login and error pages. */
body.from-primary-soft { background: color-mix(in srgb, var(--brand-secondary) 5%, white); }

@media (max-width: 767px) {
    .hero-overlay,
    .home-hero .hero-overlay {
        background: linear-gradient(180deg,
            color-mix(in srgb, var(--brand-secondary) 92%, transparent) 0%,
            color-mix(in srgb, var(--brand-secondary) 80%, transparent) 100%);
    }
}
