/* =====================================================================
 * Trevose Day School — theme Custom CSS
 * Goes in Appearance → Customize → Additional CSS on
 * trevosedayschool.wpcomstaging.com. Push it with ./push_css.py --go.
 *
 * PART 1 is the old site's own Additional CSS, verbatim (extracted to
 * old-theme-custom.css). Do not reformat it — keeping it byte-identical is
 * what makes "did this come from the old site?" answerable later.
 *
 * PART 2 is the rebuild's parity layer: things the old site did through
 * Smarty's theme-options panel or Slider Revolution, neither of which has a
 * REST route, so they cannot be set from here the way the old site set them.
 * Every block in part 2 says what the real fix is and when to delete it.
 * ===================================================================== */


/* =====================================================================
 * PART 1 — old site, verbatim
 * ===================================================================== */

.widget_footer .textwidget p {
    line-height: 26px;
    color: #fff;
}
.footer .copyright {
    color: #Fff;
}

.widget-area_type_footer {
    border-bottom: none;
}

#mc4wp-form-1 input[type="text"]::-webkit-input-placeholder, #mc4wp-form-1 input[type="email"]::-webkit-input-placeholder, #mc4wp-form-1 .mc4wp-response p {
    color: #fff !important;
}

.widget_footer .widget_title {
    font-weight: 500;
    color: #fff;
}

.stm-image-box__title_inside {
    margin-top: 0;
}

.stm-nav__menu_type_header > .menu-item {
    margin: 0 18px;
}

.vc_tta-tabs_style-1.vc_tta-tabs .vc_tta-tabs-list .vc_tta-tab > a {
    padding: 18px 15px;
}

.homepage-tabs-custom .vc_tta-tab.vc_active {
    border-top: 4px solid #81ca00 !important;
}

.homepage-tabs-custom .vc_tta-tab.vc_active, .homepage-tabs-custom .vc_tta-tab.vc_active > a {
    background-color: #fff !important;
    color: #00aaff !important;
}


.homepage-tabs-custom li.vc_tta-tab > a {
    background-color: #81ca00 !important;
    text-transform: uppercase !important;
}

.header_view-style_1 .stm-nav__menu_type_header > .menu-item > a {
    color: #81ca00;
    text-transform: uppercase;
}

.top-bar_view-style_1 {
    border-bottom: none;
}

/* header search removed at the school's request (2026-09-29). Both top bars
 * hold nothing but the search form, so hide the bars themselves rather than
 * leave empty strips. The toggle is a Smarty theme option (wp-admin only). */
.top-bar,
.top-bar-mobile {
    display: none !important;
}

.stm-rev-nav a {text-align: center!important;}

@media (max-width: 640px)
{
.stm-image-box_img_left .stm-image-box__image {
    float: left;
    margin-bottom: 20px;
    margin-right: 20px;
}
}


input[type="email"] {
    padding: 9px 20px;
    background: #fff;
    border: 1px solid #e6e6e6;
    color: #011b3a;
    line-height: 30px;
    vertical-align: middle;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}



.stm-page-head_size_small {
  padding-top: 175px;
  padding-bottom: 78px; }

@media (max-width: 640px)
{
.stm-page-head_size_small {
  padding-top: 75px;
  padding-bottom: 78px; }
}


.textBgDarkBlue {
    background: rgba(0, 51, 102, 0.85) !important;
}

.widget_footer.widget_nav_menu .menu > li > a {
    color: #fff;
}

.widget_footer .list_contact-details .list__item {
    color: #FFF;
}

.widget_footer .list_contact-details .list__item a {
    color: #ffffff;
}

.widget_footer .list_contact-details .list__item a:hover {
    color: #fff;
    text-decoration: underline;
}




::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #999;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #999;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #999;
}



.stm-page-head_color_white .stm-page-head__overlay {
    background: rgba(0, 51, 102, 0.85);
}


.responsiveCal {
position: relative; padding-bottom: 75%; height: 0; overflow: hidden;
}

.responsiveCal iframe {
position: absolute; top:0; left: 0; width: 100%; height: 100%;
}

.stm-teacher__name {color: #81ca00!important;}

.form-right-hs {
    width: 51%!important;
    display: inline-block!important;
    float: right!important;

}

.form-left-hs {
    width: 48%!important;
    display: inline-block!important;
    float: left!important;
    clear:none!important;
}


/* =====================================================================
 * PART 2 — rebuild parity layer (added 2026-09-22)
 * ===================================================================== */

/* ---- Logo -----------------------------------------------------------
 * The old header carried an image logo:
 *   <a class="logo"><img src=".../2017/05/Trevose-logo-revised-green.png"></a>
 * This install has never had one set, so Smarty falls back to its text logo
 * (`a.logo.logo_type_text` wrapping the site title). The logo is a Smarty
 * theme option and theme options have no REST route, so it is painted on
 * here instead — same file, re-uploaded to this site's media library.
 *
 * REAL FIX: Appearance → Customize → (Smarty) Header → Logo, upload
 * Trevose-logo-revised-green.png. Then DELETE this block — a real <img> is
 * better for print, high-contrast modes and anyone with images disabled.
 *
 * Applies to both the desktop header and .header-mobile, which use the same
 * markup. The text stays in the DOM (clipped, not display:none) so it is
 * still the accessible name of the link.
 */
.logo.logo_type_text {
    display: block;
    width: 350px;
    max-width: 62vw;
    height: 87px;
    background: url("https://trevosedayschool.org/wp-content/uploads/2026/09/Trevose-logo-revised-green.png") no-repeat left center;
    background-size: contain;
}
.logo.logo_type_text .logo__inner {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.header-mobile__logo .logo.logo_type_text {
    height: 54px;
}

/* ---- Front page has no page-head band -------------------------------
 * The old site ran the page-head (the navy title band under the header) on
 * every inner page but NOT on the front page, which went straight from the
 * header into the slider. Verified against the 2025-05-04 capture: `/` has
 * no .stm-page-head element at all, while /about, /student-life, /alumni,
 * /admissions, /academics, /contact-us and /about/campus all do.
 *
 * REAL FIX: the per-page "hide page title" switch in Smarty's page options.
 * Page meta, again no REST route. Delete this block if that gets set.
 */
.home .stm-page-head {
    display: none;
}
/* Smarty overlays the header (.header-holder is position:absolute from
 * tablet up) and relies on the page-head's 175px top padding to clear it.
 * With the page-head gone, only .content's 80px padding was left: the
 * 100px desktop header hid the top 20px of the hero, the 187px wrapped
 * header at 800-1024px hid 107px, and on mobile (header in flow) it left an
 * 80px grey gap above the hero. Put the header back in flow on the front
 * page and drop the padding, so the hero starts under the header at any
 * header height. */
.home .header-holder {
    position: relative;
}
.home .content {
    padding-top: 0;
}

/* ---- Hero -----------------------------------------------------------
 * Old: Slider Revolution "home-2", sliderLayout:"fullwidth", gridheight
 * 850 / 850 / 650 / 500 at the 1240 / 1024 / 778 / 480 breakpoints — so it
 * cropped every slide to a fixed band the full width of the browser.
 *
 * The stand-in is [vc_images_carousel], which has no height of its own and
 * just runs each photo at its natural aspect ratio. The five recovered
 * slides are 2048px wide and between 695 and 1466 tall, so without this the
 * hero is ~1030px tall on a 1440px screen and jumps height on every slide.
 * object-fit reproduces Slider Revolution's crop.
 *
 * !important because WPBakery's carousel JS writes inline heights
 * (data-auto-height="yes" on the container).
 */
.tds-hero .vc_item .vc_inner img {
    width: 100% !important;
    height: 850px !important;
    object-fit: cover;
    object-position: center;
}
.tds-hero .vc_carousel-inner,
.tds-hero .vc_carousel-slideline,
.tds-hero .vc_carousel-slideline-inner,
.tds-hero .vc_item,
.tds-hero .vc_item .vc_inner {
    height: 850px !important;
}
@media (max-width: 1024px) {
    .tds-hero .vc_item .vc_inner img,
    .tds-hero .vc_carousel-inner,
    .tds-hero .vc_carousel-slideline,
    .tds-hero .vc_carousel-slideline-inner,
    .tds-hero .vc_item,
    .tds-hero .vc_item .vc_inner { height: 650px !important; }
}
@media (max-width: 778px) {
    .tds-hero .vc_item .vc_inner img,
    .tds-hero .vc_carousel-inner,
    .tds-hero .vc_carousel-slideline,
    .tds-hero .vc_carousel-slideline-inner,
    .tds-hero .vc_item,
    .tds-hero .vc_item .vc_inner { height: 500px !important; }
}
/* The old slider showed a thin progress bar, not dots. Keep the dots (they
 * are the only affordance this carousel has) but sit them over the photo
 * rather than pushing the next section down. */
.tds-hero .vc_images_carousel .vc_carousel-indicators {
    position: absolute;
    bottom: 18px;
    left: 0;
    right: 0;
    margin: 0;
    z-index: 2;
}
/* Full-bleed the row in CSS rather than trusting WPBakery's stretch JS.
 * data-vc-full-width rows are sized by js_composer's vc_rowBehaviour(), which
 * measures window width on load and writes inline width/margin-left. It
 * measures before the carousel has laid out and does not account for the
 * scrollbar, so the hero came up ~90px short of the right edge on the live
 * page and ~420px short once the carousel re-ran. The margin-left:calc trick
 * is independent of all of that, so it cannot race. !important because the JS
 * writes its numbers inline.
 */
.tds-hero-row {
    position: relative;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden;
}
.tds-hero-row .vc_column-inner,
.tds-hero-row .wpb_column {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* The carousel writes per-item widths inline from the container width it saw
 * at init. Pin the items to the viewport so a late/early measurement cannot
 * leave a gap; the slideline is a flex row, so the transform arithmetic still
 * lands on item boundaries. */
.tds-hero .vc_images_carousel,
.tds-hero .vc_carousel-slideline-inner > .vc_item {
    width: 100vw !important;
}

/* ---- Footer columns -------------------------------------------------
 * The four columns are custom_html/text widgets, so their wrappers are
 * .widget_custom_html / .widget_text -- NOT the .widget_nav_menu and
 * .widget_contact-details that PART 1's rules (and Smarty's own footer CSS)
 * key off. Rebuilding them as native nav_menu / stm_widget_contact_details
 * widgets would mean creating a nav-menu term and an stm widget instance just
 * to emit the same markup, so instead the same treatment is re-applied to the
 * markup directly. Delete this block if the columns are ever swapped to the
 * native widget types.
 */
/* Three columns since the "What's New" column was dropped (2026-09-29), but
 * Smarty still emits one col-lg-3 per registered footer sidebar, empty or not,
 * which left the right quarter of the footer blank. Hide empty slots and split
 * the rest in thirds at the lg/md breakpoints (col-md-3 applies from 992px);
 * below that the theme's col-sm-6 / col-xs-12 stacking is left alone. */
.widget-area_type_footer .row > [class*="col-"]:not(:has(.widget)) {
    display: none;
}
@media (min-width: 992px) {
    .widget-area_type_footer .row > .col-md-3 {
        width: 33.3333%;
    }
}
/* !important is load-bearing: the theme styles lists inside widget bodies via
 * a `.widget .textwidget ul`-shaped rule (specificity 0,2,1 -- it computes to
 * list-style:disc; padding-left:14px), which outranks a plain
 * `.widget_footer .list_unstyle` at 0,2,0. Verified with getComputedStyle
 * rather than guessed. */
.widget_footer .list_unstyle,
.widget_footer .list_contact-details,
.widget_footer .list_social-networks,
.widget_footer .textwidget ul,
.widget_footer .menu {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}
.widget_footer .menu > li { margin-bottom: 6px; }
.widget_footer .menu > li > a { color: #fff; }
.widget_footer .menu > li > a:hover { color: #81ca00; }
/* "Take a tour" follows the contact list directly: the theme zeroes the last
 * list item's margin and the <p> around the button has none, so it sat flush
 * (0px) under the email line. 30px = a touch more than the 20px between items. */
.widget_footer .list_contact-details + p { margin-top: 30px; }

/* ---- Contact forms --------------------------------------------------
 * The 9 pages that used to carry [wpforms id="7077"] now use Jetpack's
 * [contact-form], which ships almost no styling. PART 1 already styles
 * input[type=email] (that rule came from the old site); this extends the same
 * treatment to the other controls so the form matches the theme's inputs.
 */
.wpb_content_element .contact-form input[type="text"],
.wpb_content_element .contact-form input[type="email"],
.wpb_content_element .contact-form textarea {
    width: 100%;
    max-width: 100%;
    padding: 9px 20px;
    background: #fff;
    border: 1px solid #e6e6e6;
    color: #011b3a;
    line-height: 30px;
    border-radius: 0;
    box-shadow: none;
}
.wpb_content_element .contact-form textarea { line-height: 24px; min-height: 160px; }
.wpb_content_element .contact-form label {
    font-weight: 600;
    color: #011b3a;
    margin-bottom: 6px;
    display: block;
}
.wpb_content_element .contact-form button[type="submit"],
.wpb_content_element .contact-form input[type="submit"] {
    width: auto;
    background: #81ca00;
    border: 1px solid #81ca00;
    border-radius: 0;
    color: #fff;
    padding: 10px 34px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    transition: all .3s ease;
}
.wpb_content_element .contact-form button[type="submit"]:hover,
.wpb_content_element .contact-form input[type="submit"]:hover {
    background: transparent;
    color: #81ca00;
}

/* ---- Footer copyright ----------------------------------------------
 * The theme's own bottom-bar line ("Copyright © Secondary School Theme by
 * Stylemix Themes") is a Smarty theme option. Theme options are not writable
 * over REST -- /wp/v2/settings exposes 37 settings and none of them is this --
 * so it is hidden here rather than changed at source.
 *
 * REAL FIX: Smarty's theme options / Customizer, then delete this block.
 * The old site put the school's NAP line in this bar; putting that back via
 * CSS `content` was deliberately NOT done, because an address and phone number
 * are real content that should be selectable, copyable and machine-readable,
 * and generated content is none of those.
 */
.footer .copyright {
    display: none;
}

/* ---- Section bands: equal padding top and bottom -------------------
 * The old stacked-section pages (Enrichment, After School Programs, School
 * Traditions, Giving, Financial Aid, the Academics/Admissions sub-pages, ...)
 * give their rows NO padding -- several force `padding-top:0 !important` -- and
 * fake the spacing with [stm_spacing] / [vc_empty_space] elements dropped into
 * whichever column the author happened to edit. Measured 2026-09-29: content
 * sat flush on the top edge of every band (0px) while the bottom gap drifted
 * from 15px to 65px, so images butted into the band above them.
 *
 * build_pages.py tag_bands() marks those rows `tds-band` (it leaves alone
 * rows with a real padding of their own, edge-to-edge map/hero rows, disabled
 * and empty rows, and the whole homepage). Here every band gets the same
 * padding top and bottom, and the ad-hoc spacers inside it are switched off.
 *
 * .vc_row.tds-band (0,2,0) + !important beats the rows' own
 * .vc_custom_NNN{padding-top:0 !important} (0,1,0). The spacers' heights are
 * inline styles written by jQuery, so display:none !important is what wins.
 */
.vc_row.tds-band {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}
.tds-band .stm-spacing,
.tds-band .vc_empty_space {
    display: none !important;
}
/* WPBakery pads the columns of any row with a background 35px from the top
 * (.vc_row-has-fill > .vc_column_container > .vc_column-inner). The image
 * columns cancel it with their own padding-top:0, the text columns don't, so
 * every white/grey band had its heading sitting 35px below the photo beside it. */
.tds-band > .vc_column_container > .vc_column-inner {
    padding-top: 0 !important;
}
/* last visible element in each column: drop WPBakery's 35px content margin so
 * the band's padding is the only thing below the content */
.tds-band .wpb_wrapper > :not(script, .stm-spacing, .vc_empty_space):not(:has(~ :not(script, .stm-spacing, .vc_empty_space))) {
    margin-bottom: 0 !important;
}
/* the page's .content box already pads 80px above and 100px below; don't
 * stack band padding on top of that where the band has no fill of its own */
.wpb-content-wrapper > .tds-band:first-child:not(.vc_row-has-fill) {
    padding-top: 0 !important;
}
.wpb-content-wrapper > .tds-band:last-child:not(.vc_row-has-fill) {
    padding-bottom: 0 !important;
}
@media (max-width: 767px) {
    .vc_row.tds-band {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
    /* columns stack here; the hidden spacers used to separate them */
    .tds-band > .wpb_column + .wpb_column {
        margin-top: 30px;
    }
    .tds-band > .vc_hidden-xs + .wpb_column {
        margin-top: 0;
    }
}


/* ---- Inner-page title bands (generated by build_page_heads.py) ------
 * One rule per page: the photo Smarty would have drawn from
 * stm_page_title_bgimage, which is not writable over REST on this install.
 * The gradient is the old .stm-page-head__overlay wash; this markup has no
 * overlay element, so it is layered in as a background image instead.
 * Regenerate with ./build_page_heads.py --go; do not hand-edit.
 */
.stm-page-head[class] {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* Summer Camp 2027 */
body.page-id-597 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1060646-2.jpg");
}
/* Programs */
body.page-id-598 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/2-2.jpg");
}
/* Alumni */
body.page-id-599 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_1333-3.jpg");
}
/* Academics */
body.page-id-600 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1030149.jpg");
}
/* Admissions */
body.page-id-601 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_7263-rotated.jpg");
}
/* News */
body.page-id-602 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1070283.jpg");
}
/* About Us */
body.page-id-603 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_6468-SM.jpg");
}
/* Contact Us */
body.page-id-604 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1060599-1-B-1.jpg");
}
/* Home */
body.page-id-605 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/009-RET-2.jpg");
}
/* Giving */
body.page-id-606 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/Trevose_imageLibrary_HERO-19.jpg");
}
/* Forms & Applications */
body.page-id-607 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1050690-1-1.jpg");
}
/* Admission FAQ */
body.page-id-608 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1050069-910x500-1.jpg");
}
/* Financial Aid */
body.page-id-609 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/Untitled-12.jpg");
}
/* Tuition & Fees */
body.page-id-610 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1030152.jpg");
}
/* Schedule A Visit */
body.page-id-611 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/MagnetsElectricity.jpg");
}
/* Admissions Welcome */
body.page-id-612 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/students-display-egg-creations.jpeg");
}
/* Special Needs Program */
body.page-id-613 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/Trevose_imageLibrary_HERO-31.jpg");
}
/* After School Programs */
body.page-id-614 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_8168.jpg");
}
/* Field Trips */
body.page-id-615 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/TDS-Rock-study-01.jpg");
}
/* School Traditions */
body.page-id-616 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/018-RET_1.jpg");
}
/* Philosophy */
body.page-id-617 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1060091.jpg");
}
/* How Learning Happens */
body.page-id-618 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_20160329_101855471.jpg");
}
/* Learning Environment */
body.page-id-619 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/childrens-hands-in-circles.jpg");
}
/* Welcome */
body.page-id-620 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/Trevose_imageLibrary_HERO-20.jpg");
}
/* Historical Overview */
body.page-id-621 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1060018.jpg");
}
/* Mission & Values */
body.page-id-622 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1060101.jpg");
}
/* Campus */
body.page-id-623 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_20160422_092804152_HDR-RET.jpg");
}
/* Admission Process */
body.page-id-624 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_20160523_133155609_HDR.jpg");
}
/* Discovery Studio */
body.page-id-625 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/TDS-Mrs-McNallys-watercolors-02-1.jpg");
}
/* Enrichment */
body.page-id-626 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/P1050918.jpg");
}
/* Faculty & Staff */
body.page-id-627 .stm-page-head {
    background-image: linear-gradient(rgba(0, 51, 102, 0.85), rgba(0, 51, 102, 0.85)), url("https://trevosedayschool.org/wp-content/uploads/2026/09/IMG_20160422_093006715-RET-2-1.jpg");
}


/* ---- Homepage hero slideshow (generated by build_hero.py) -----------
 * Replaces [vc_images_carousel], which could show the photos but none of the
 * old slider's copy. CSS-only crossfade: 5 slides x 5s = 25s,
 * staggered by animation-delay. No JS, so nothing to race.
 * Regenerate with ./build_hero.py; do not hand-edit.
 */
.tds-hero-slider {
    position: relative;
    width: 100%;
    height: 850px;
    overflow: hidden;
    background: #0b1b33;
}
.tds-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    animation: tds-hero 25s infinite;
    animation-delay: calc(var(--i) * 5s);
}
.tds-slide__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* The old slider drew its text over a .textBgDarkBlue shape at
 * rgba(0,51,102,.85), offset 75px from the grid's left edge. The grid was
 * 1140px centred, so the box starts at max(75px, (100% - 1140px)/2 + 75px). */
.tds-slide__box {
    position: absolute;
    left: max(20px, calc((100% - 1140px) / 2));
    top: 50%;
    transform: translateY(-50%);
    max-width: 560px;
    padding: 38px 42px;
    background: rgba(0, 51, 102, 0.85);
    color: #fff;
}
.tds-slide__title {
    margin: 0 0 18px;
    font-size: 42px;
    line-height: 54px;
    font-weight: 300;
    color: #fff;
}
.tds-slide__text {
    margin: 0 0 22px;
    font-size: 16px;
    line-height: 30px;
    color: #fff;
}
.tds-slide__link {
    display: inline-block;
    padding: 9px 26px;
    border: 1px solid #fff;
    color: #fff;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .5px;
    transition: all .3s ease;
}
.tds-slide__link:hover {
    background: #81ca00;
    border-color: #81ca00;
    color: #fff;
}
/* Each slide holds for its full 20% share and only starts fading out at
 * that point, by which time the NEXT slide is already fading in -- they overlap
 * for 2% of the cycle. Fading out before the share ended left a
 * 2% dead window (0.5s) four times a cycle where the backdrop
 * showed through. */
@keyframes tds-hero {
    0%                      { opacity: 0; }
    2.00%             { opacity: 1; }
    20.00%            { opacity: 1; }
    22.00%     { opacity: 0; }
    100%                    { opacity: 0; }
}
@media (max-width: 1024px) {
    .tds-hero-slider { height: 650px; }
    .tds-slide__title { font-size: 34px; line-height: 44px; }
}
@media (max-width: 778px) {
    .tds-hero-slider { height: 500px; }
    .tds-slide__box {
        left: 20px; right: 20px; max-width: none; padding: 24px 22px;
    }
    .tds-slide__title { font-size: 26px; line-height: 34px; margin-bottom: 12px; }
    .tds-slide__text { font-size: 15px; line-height: 26px; margin-bottom: 16px; }
}
/* Honour a reduced-motion preference: hold slide 1, no cycling. */
@media (prefers-reduced-motion: reduce) {
    .tds-slide { animation: none; }
    .tds-slide[style*="--i:0"] { opacity: 1; }
}