/* ============================================================
   Anikeola Schools Child — main stylesheet
   Brand anchors (from the approved design work):
   - School navy:  #003366 (deep blue family used across the site)
   - Crest gold:   from the College crest Variant B
   All section-level design (hero, cards, carousel) gets built
   here in named blocks as the theme redesign proceeds.
   ============================================================ */

/* Placeholder — intentionally empty at activation so switching
   to this child theme changes nothing visually on day one. */

/* ============================================================
   Header crest sizing (v1.1.1)
   The header logo file is a 2400px print master and no
   Customizer rule sizes it, so phones rendered it at natural
   width and it swallowed the whole first screen. Pin the
   header crest to a sane height at every width. The school
   name text beside it comes from the Customizer ::after rule
   and is unaffected.
   ============================================================ */
#site-logo .custom-logo-link img.custom-logo,
#site-logo img.custom-logo {
    width: auto;
    height: auto;
    max-width: 190px;
    max-height: 76px;
    object-fit: contain;
}

@media (max-width: 767px) {
    #site-logo .custom-logo-link img.custom-logo,
    #site-logo img.custom-logo {
        max-width: 140px;
        max-height: 56px;
    }
}

/* Homepage: render the hero section first (v1.1.2).
   The hero section (data-id d0f4352, class acc-hero-first) sits second in
   the Elementor structure, after "What We Offer" (45b52263); the Elementor
   Navigator drag would not reorder them, so the visual order is set here.
   Both sections are direct children of .elementor-26. */
.elementor.elementor-26 {
    display: flex;
    flex-direction: column;
}
.elementor.elementor-26 > section.acc-hero-first {
    order: -1;
}

/* Header / navbar (v1.1.3).
   The school name + tagline render as a ::after pseudo-element on the logo
   link (a rule inherited from the parent theme's Customizer CSS). Its content
   uses "\a" as the line break, but without white-space: pre-line the break
   collapses, so the name runs as one long wrapping sentence beside the crest
   and the mobile Menu toggle drops far below the logo row ("navbar is still
   poor", owner's phone check 2026-11-10).
   Fix: flex the logo link so crest and name sit side by side, honour the
   line break, and flex the header row so the Menu toggle stays on the row. */
#site-header #site-header-inner {
    display: flex;
    align-items: center;
}
#site-header #site-logo {
    flex: 0 1 auto;
}
#site-header #site-logo-inner .custom-logo-link {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}
#site-header #site-logo #site-logo-inner .custom-logo-link::after {
    white-space: pre-line;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
    color: #21374e;
}
#site-header #site-navigation-wrap {
    margin-left: auto;
}
#site-header .oceanwp-mobile-menu-icon {
    margin-left: auto;
    float: none;
}
@media (max-width: 767px) {
    #site-header #site-logo-inner .custom-logo-link {
        gap: 9px;
    }
    #site-header #site-logo #site-logo-inner .custom-logo-link::after {
        font-size: 15px;
    }
}