/* Houston Website Landing Page */
body.houston-site-body {
    background: #ffffff;
    color: #07142d;
    min-height: 100vh;
    padding: 0;
}

.houston-site-body a {
    color: inherit;
}

.houston-site-page {
    background: #ffffff;
    min-height: 100vh;
    overflow: hidden;
}

.houston-site-nav {
    align-items: center;
    background: #ffffff;
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(220px, 310px) minmax(360px, 1fr) minmax(180px, 230px) auto;
    margin: 0;
    min-height: 86px;
    padding: 10px 52px;
    position: relative;
    z-index: 10;
}

.houston-site-logo,
.houston-site-footer-logo {
    color: #07142d;
    display: inline-flex;
    flex-direction: column;
    line-height: 1;
    text-decoration: none;
    width: fit-content;
}

.houston-site-logo-image {
    display: block;
    height: auto;
    max-width: 100%;
    width: 182px;
}

/* Fluid logo sizing keeps the brand mark responsive without changing its visual weight. */
.houston-site-logo-main {
    align-items: center;
    display: inline-flex;
    font-size: clamp(2.1rem, 3vw, 2.45rem);
    font-weight: 900;
    line-height: 0.9;
}

.houston-site-logo-o {
    align-items: center;
    border: 4px solid #07142d;
    border-radius: 50%;
    display: inline-flex;
    height: 0.74em;
    justify-content: center;
    margin: 0 1px;
    position: relative;
    width: 0.74em;
}

.houston-site-logo-o::after {
    background: #0098ad;
    border-radius: 999px;
    content: "";
    display: block;
    height: 5px;
    transform: rotate(-12deg);
    width: 60%;
}

.houston-site-logo-sub {
    color: #0098ad;
    font-size: 0.94rem;
    font-weight: 800;
    line-height: 1.05;
    text-align: center;
}

.houston-site-menu {
    align-items: stretch;
    display: flex;
    gap: 42px;
    height: 100%;
    justify-content: center;
}

.houston-site-menu-toggle {
    display: none;
}

/* Keep nav labels on one line as the header gap compresses. */
.houston-site-menu a {
    align-items: center;
    color: #07142d;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 900;
    padding: 0 8px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}

.houston-site-menu a::after {
    background: transparent;
    border-radius: 999px;
    bottom: 12px;
    content: "";
    height: 4px;
    left: 8px;
    position: absolute;
    right: 8px;
}

.houston-site-menu a.is-active::after,
.houston-site-menu a:hover::after {
    background: #0098ad;
}

.houston-site-menu-item {
    display: inline-flex;
    height: 100%;
    position: relative;
}

.houston-site-menu-dropdown {
    background: #ffffff;
    border: 1px solid rgba(7, 20, 45, 0.12);
    border-radius: 7px;
    box-shadow: 0 16px 38px rgba(7, 20, 45, 0.2);
    display: grid;
    gap: 2px;
    left: 50%;
    min-width: 260px;
    opacity: 0;
    padding: 8px;
    pointer-events: none;
    position: absolute;
    top: calc(100% - 8px);
    transform: translate(-50%, 8px);
    transition: opacity 0.16s ease, transform 0.16s ease;
    visibility: hidden;
    z-index: 20;
}

.houston-site-menu-dropdown a {
    border-radius: 5px;
    color: #07142d;
    display: block;
    font-size: 0.78rem;
    line-height: 1.15;
    min-height: 0;
    padding: 10px 12px;
    text-align: left;
    text-transform: none;
    white-space: normal;
}

.houston-site-menu-dropdown a::after {
    display: none;
}

.houston-site-menu-dropdown a:hover,
.houston-site-menu-dropdown a:focus-visible {
    background: rgba(0, 152, 173, 0.1);
}

.houston-site-menu-item:hover .houston-site-menu-dropdown,
.houston-site-menu-item:focus-within .houston-site-menu-dropdown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, 0);
    visibility: visible;
}

.houston-site-hours {
    align-items: center;
    color: #07142d;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    text-transform: uppercase;
}

.houston-site-hours strong,
.houston-site-hours span span {
    display: block;
    font-weight: 900;
    line-height: 1.05;
}

.houston-site-hours strong {
    font-size: 0.8rem;
}

.houston-site-hours span span {
    font-size: 1.06rem;
}

.houston-site-nav-ticket-cta {
    font-size: 0.82rem;
    justify-self: end;
    min-height: 40px;
    padding: 9px 16px;
    white-space: nowrap;
}

/* Drawer-only "Member sign-in" row; hidden on the desktop horizontal nav,
   revealed inside the open mobile menu (see mobile nav block at end). */
.houston-site-menu a.houston-site-menu-mobile-extra {
    display: none;
}

.houston-site-page.is-viewing-tickets .houston-site-nav-ticket-cta {
    display: none;
}

/* Right-aligned nav action group: Member sign-in + Buy Tickets share the
   final grid column so the header stays a clean 4-column layout. */
.houston-site-nav-actions {
    align-items: center;
    display: inline-flex;
    gap: 10px;
    justify-self: end;
}

.houston-site-nav-member-cta {
    background: transparent;
    border: 2px solid currentColor;
    color: #07142d;
    font-size: 0.82rem;
    min-height: 40px;
    padding: 9px 16px;
    white-space: nowrap;
}

.houston-site-nav-member-cta:hover,
.houston-site-nav-member-cta:focus-visible {
    background: rgba(7, 20, 45, 0.08);
}

/* Dark navs (events pages / austin theme) need a light outline + text. */
.houston-events-page .houston-site-nav-member-cta,
.austin-theme .houston-site-nav-member-cta {
    color: #f6f1e7;
}

.houston-events-page .houston-site-nav-member-cta:hover,
.houston-events-page .houston-site-nav-member-cta:focus-visible,
.austin-theme .houston-site-nav-member-cta:hover,
.austin-theme .houston-site-nav-member-cta:focus-visible {
    background: rgba(246, 241, 231, 0.14);
}

.houston-site-hero {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.58) 26%, rgba(0, 0, 0, 0.05) 55%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.22) 100%),
        url("/static/images/houston/hero.webp") center 34% / cover no-repeat;
    color: #ffffff;
    display: flex;
    min-height: 368px;
    overflow: hidden;
    padding: 20px 64px 28px;
    position: relative;
}

.houston-site-hero::after {
    background: #ffffff;
    bottom: -24px;
    clip-path: polygon(0 30%, 12% 36%, 25% 48%, 38% 58%, 50% 62%, 62% 58%, 75% 48%, 88% 36%, 100% 30%, 100% 100%, 0 100%);
    content: "";
    height: 56px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1;
}

.houston-site-hero-copy {
    align-self: center;
    max-width: 520px;
    position: relative;
    z-index: 2;
}

/* Fluid hero headline scales between desktop and mobile art direction. */
.houston-site-hero h1 {
    color: #ffffff;
    font-size: clamp(2.85rem, 4.6vw, 3.35rem);
    font-weight: 900;
    line-height: 0.9;
    margin: 0 0 9px;
    max-width: 470px;
    text-align: left;
}

.houston-site-hero p {
    color: #ffffff;
    font-size: 1.15rem;
    font-weight: 500;
    line-height: 1.18;
    margin: 0 0 10px;
    max-width: 490px;
}

.houston-site-price-strip {
    align-items: stretch;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 4px;
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    margin: 6px 0 12px;
    max-width: 470px;
    min-height: 72px;
    overflow: hidden;
}

.houston-site-price-strip div {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 16px;
    text-align: center;
}

.houston-site-price-strip div + div {
    border-left: 1px solid rgba(255, 255, 255, 0.86);
}

.houston-site-price-strip span {
    color: #ffffff;
    display: block;
    font-size: 0.75rem;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
}

.houston-site-price-strip strong {
    color: #ffffff;
    display: block;
    font-size: 1.72rem;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
}

.houston-site-price-strip div:nth-child(2) strong {
    color: #f0440b;
}

.houston-site-price-strip small {
    color: #ffffff;
    display: block;
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1;
}

.houston-site-hero-actions {
    display: grid;
    gap: 14px;
    grid-template-columns: 1.18fr 0.95fr;
    max-width: 492px;
}

.houston-site-hero-actions-pass-only {
    grid-template-columns: minmax(190px, 230px);
}

.houston-site-btn {
    align-items: center;
    border-radius: 5px;
    box-sizing: border-box;
    display: inline-flex;
    font-size: 1rem;
    font-weight: 900;
    justify-content: center;
    line-height: 1.15;
    min-height: 44px;
    padding: 11px 24px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.houston-site-btn:hover,
.houston-site-btn:focus-visible {
    transform: translateY(-1px);
}

.houston-site-btn-primary {
    background: #f0440b;
    border: 2px solid #f0440b;
    color: #ffffff;
    font-weight: 700;
}

.houston-site-btn-primary:hover,
.houston-site-btn-primary:focus-visible {
    background: #d83804;
    border-color: #d83804;
}

.houston-site-btn-secondary {
    background: rgba(0, 0, 0, 0.28);
    border: 2px solid rgba(255, 255, 255, 0.9);
    color: #ffffff;
}

.houston-site-btn-secondary:hover,
.houston-site-btn-secondary:focus-visible {
    background: rgba(0, 157, 204, 0.2);
}

/* Expose ticket-band width for descendant container queries without changing the grid intent. */
.houston-ticket-band {
    align-items: stretch;
    background: #ffffff;
    container: houston-ticket-band / inline-size;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(190px, 220px) minmax(180px, 216px) minmax(180px, 216px) minmax(420px, 1fr);
    padding: 22px 64px 18px;
    position: relative;
    z-index: 3;
}

.houston-ticket-intro {
    padding-top: 2px;
}

.houston-ticket-intro h2,
.houston-exhibit-panel h2,
.houston-visit-info h2,
.houston-site-footer h2 {
    color: #07142d;
    font-weight: 900;
    line-height: 1;
    margin: 0;
    text-align: left;
    text-transform: uppercase;
}

.houston-ticket-intro h2 {
    font-size: 1.45rem;
    margin-bottom: 16px;
}

.houston-ticket-intro p {
    color: #07142d;
    font-size: 0.92rem;
    line-height: 1.42;
    margin: 0 0 18px;
}

.houston-digital-badge {
    align-items: center;
    color: #008a8d;
    display: flex;
    gap: 11px;
    max-width: 205px;
    text-transform: uppercase;
}

.houston-digital-badge span {
    align-items: center;
    background: #008a8d;
    border-radius: 50%;
    display: inline-flex;
    flex: 0 0 auto;
    height: 40px;
    justify-content: center;
    position: relative;
    width: 40px;
}

.houston-digital-badge span::before {
    border: 2px solid #ffffff;
    border-radius: 2px;
    content: "";
    height: 23px;
    width: 14px;
}

.houston-digital-badge span::after {
    background: #ffffff;
    border-radius: 50%;
    bottom: 9px;
    content: "";
    height: 3px;
    position: absolute;
    width: 3px;
}

.houston-digital-badge strong {
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.15;
}

.houston-ticket-card {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dedede;
    border-radius: 7px;
    box-shadow: 0 3px 12px rgba(7, 20, 45, 0.13);
    display: flex;
    flex-direction: column;
    min-height: 218px;
    padding: 24px 18px 16px;
    position: relative;
    text-align: center;
}

.houston-ticket-card h3 {
    color: #07142d;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.2;
    margin: 0 0 14px;
    text-transform: uppercase;
}

.houston-ticket-card p {
    color: #07142d;
    font-size: 0.88rem;
    line-height: 1.28;
    margin: 0;
    max-width: 160px;
}

/* Fluid ticket price type preserves hierarchy while avoiding fixed viewport jumps. */
.houston-ticket-price {
    color: #008a8d !important;
    font-size: clamp(1.75rem, 2.6vw, 2rem) !important;
    font-weight: 900;
    line-height: 1 !important;
    margin-bottom: 14px !important;
}

.houston-ticket-card .houston-site-btn {
    height: 60px;
    margin-top: auto;
    max-width: 178px;
    min-height: 60px;
    padding: 0 18px;
    width: 100%;
}

.houston-ticket-card .houston-site-btn-primary,
.houston-ticket-card .houston-site-btn-primary:visited,
.houston-ticket-card .houston-site-btn-primary:hover,
.houston-ticket-card .houston-site-btn-primary:focus-visible {
    color: #ffffff;
}

.houston-ticket-ribbon {
    background: #008a8d;
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 900;
    left: 50%;
    line-height: 1;
    min-width: 118px;
    padding: 7px 13px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: -7px;
    transform: translateX(-50%);
}

.houston-ticket-ribbon::before,
.houston-ticket-ribbon::after {
    border-bottom: 10px solid transparent;
    border-top: 10px solid transparent;
    content: "";
    position: absolute;
    top: 0;
}

.houston-ticket-ribbon::before {
    border-right: 10px solid #008a8d;
    left: -10px;
}

.houston-ticket-ribbon::after {
    border-left: 10px solid #008a8d;
    right: -10px;
}

.houston-ticket-card-featured {
    padding-top: 28px;
}

.houston-ticket-card-featured .houston-site-btn-primary {
    background-color: #1D9E75;
    border-color: #1D9E75;
    color: #ffffff;
}

.houston-ticket-card-featured .houston-site-btn-primary:hover,
.houston-ticket-card-featured .houston-site-btn-primary:focus-visible {
    background-color: #0F6E56;
    border-color: #0F6E56;
}

.houston-exhibit-panel {
    min-width: 0;
}

.houston-exhibit-panel h2 {
    font-size: 1.35rem;
    margin-bottom: 11px;
}

/* Expose exhibit-grid width so card internals can respond to the grid container. */
.houston-exhibit-grid {
    container: houston-exhibit-grid / inline-size;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.houston-exhibit-card {
    background: #ffffff;
    border: 1px solid #dedede;
    border-radius: 7px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}

.houston-exhibit-card img {
    aspect-ratio: 1.18 / 1;
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.houston-exhibit-card h3 {
    align-items: center;
    color: #07142d;
    display: flex;
    flex: 1;
    font-size: 0.82rem;
    font-weight: 900;
    justify-content: center;
    line-height: 1.02;
    margin: 0;
    min-height: 47px;
    padding: 8px 8px 7px;
    text-align: center;
    text-transform: uppercase;
}

/* Let ticket-band children react to available band width, independent of viewport. */
@container houston-ticket-band (max-width: 64rem) {
    .houston-exhibit-panel {
        grid-column: 1 / -1;
    }
}

/* Keep ticket cards comfortable when the band is embedded in a narrower container. */
@container houston-ticket-band (max-width: 48rem) {
    .houston-ticket-intro {
        grid-column: 1 / -1;
    }

    .houston-ticket-card {
        min-height: 210px;
    }
}

/* Tune exhibit card labels from the grid width rather than the viewport. */
@container houston-exhibit-grid (max-width: 36rem) {
    .houston-exhibit-card h3 {
        min-height: 43px;
        padding-left: 6px;
        padding-right: 6px;
    }
}

.houston-visit-band {
    align-items: center;
    background: #ffffff;
    border-top: 1px solid #dde2e7;
    display: grid;
    gap: 30px;
    grid-template-columns: minmax(250px, 300px) minmax(260px, 310px) minmax(420px, 1fr);
    padding: 10px 64px 10px;
}

.houston-visit-info h2 {
    font-size: 1.45rem;
    margin-bottom: 12px;
}

.houston-visit-detail {
    align-items: center;
    display: grid;
    gap: 16px;
    grid-template-columns: 30px 1fr;
    margin: 9px 0;
}

.houston-visit-detail p {
    color: #07142d;
    font-size: 0.9rem;
    line-height: 1.35;
    margin: 0;
}

.houston-icon {
    color: #07142d;
    display: inline-block;
    height: 32px;
    position: relative;
    width: 32px;
}

.houston-icon-pin::before {
    background: #07142d;
    border-radius: 50% 50% 50% 0;
    content: "";
    height: 25px;
    left: 4px;
    position: absolute;
    top: 1px;
    transform: rotate(-45deg);
    width: 25px;
}

.houston-icon-pin::after {
    background: #ffffff;
    border-radius: 50%;
    content: "";
    height: 8px;
    left: 12px;
    position: absolute;
    top: 9px;
    width: 8px;
}

.houston-icon-phone {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M22%2016.92v3a2%202%200%200%201-2.18%202%2019.79%2019.79%200%200%201-8.63-3.07%2019.5%2019.5%200%200%201-6-6%2019.79%2019.79%200%200%201-3.07-8.67A2%202%200%200%201%204.11%202h3a2%202%200%200%201%202%201.72c.12.91.33%201.8.62%202.65a2%202%200%200%201-.45%202.11L8.09%209.91a16%2016%200%200%200%206%206l1.43-1.19a2%202%200%200%201%202.11-.45c.85.29%201.74.5%202.65.62A2%202%200%200%201%2022%2016.92z%22%20stroke%3D%22%2307142d%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") center / 32px 32px no-repeat;
}

.houston-icon-email {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%20stroke%3D%22%2307142d%22%20stroke-width%3D%222.5%22/%3E%3Cpath%20d%3D%22M4%207l8%206%208-6%22%20stroke%3D%22%2307142d%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") center / 32px 32px no-repeat;
}

.houston-icon-phone::before,
.houston-icon-phone::after,
.houston-icon-email::before,
.houston-icon-email::after {
    content: none;
}

.houston-visit-hours {
    align-items: center;
    border-left: 1px solid #aeb7c1;
    display: grid;
    gap: 21px;
    min-height: 70px;
    padding-left: 39px;
}

.houston-visit-hours dl {
    display: grid;
    gap: 2px;
    margin: 0;
}

.houston-visit-hours div {
    display: grid;
    gap: 28px;
    grid-template-columns: 66px 1fr;
}

.houston-visit-hours dt,
.houston-visit-hours dd {
    color: #07142d;
    font-size: 0.86rem;
    line-height: 1.15;
    margin: 0;
}

.houston-visit-hours dt {
    font-weight: 900;
}

.houston-map-link {
    border-radius: 5px;
    display: block;
    min-width: 0;
    overflow: hidden;
    text-decoration: none;
}

.houston-map-link img {
    display: block;
    height: auto;
    min-height: 98px;
    object-fit: cover;
    width: 100%;
}

.venue-map {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
    width: 100%;
}

.venue-map-canvas {
    border-radius: 12px;
    height: 320px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.venue-map-frame {
    border: 0;
    display: block;
    height: 100%;
    width: 100%;
}

/* Apple devices: transparent click target that opens Apple Maps. */
.venue-map-overlay {
    cursor: pointer;
    inset: 0;
    position: absolute;
}

.venue-map-directions {
    align-self: center;
}

.houston-site-footer {
    align-items: start;
    background: #05172b;
    border: 0;
    color: #ffffff;
    display: grid;
    gap: 34px;
    grid-template-columns: minmax(220px, 270px) minmax(270px, 1fr) minmax(180px, 230px) minmax(170px, 220px) minmax(150px, 210px);
    margin: 0;
    padding: 26px 64px 28px;
    text-align: left;
}

/* Fluid footer logo keeps the secondary mark proportional across footer widths. */
.houston-site-footer .houston-site-logo-main {
    color: #ffffff;
    font-size: clamp(2rem, 2.6vw, 2.25rem);
}

.houston-site-footer .houston-site-logo-o {
    border-color: #ffffff;
}

.houston-site-footer .houston-site-logo-o::after {
    background: #7fdfea;
}

.houston-site-footer .houston-site-logo-sub {
    color: #7fdfea;
}

.houston-site-copyright {
    color: #ffffff;
    font-size: 0.8rem;
    line-height: 1.45;
    margin: 16px 0 0;
}

.houston-site-footer h2 {
    color: #ffffff;
    font-size: 1rem;
    margin-bottom: 12px;
}

.houston-footer-column {
    display: grid;
    gap: 5px;
}

.houston-footer-column a {
    color: #ffffff;
    font-size: 0.82rem;
    line-height: 1.35;
    text-decoration: none;
}

.houston-footer-column a:hover,
.houston-footer-column a:focus-visible {
    text-decoration: underline;
}

.houston-social-links {
    display: flex;
    gap: 18px;
    margin-top: 6px;
}

.houston-social-links a {
    align-items: center;
    color: #ffffff;
    display: inline-flex;
    font-size: 1.55rem;
    font-weight: 900;
    height: 28px;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    width: 28px;
}

.houston-events-hero {
    background: #ffffff;
    border-top: 1px solid #dde2e7;
    color: #07142d;
    padding: 38px 64px 10px;
}

.houston-events-hero h1 {
    color: #07142d;
    font-size: clamp(2.7rem, 5vw, 4.2rem);
    font-weight: 900;
    line-height: 0.95;
    margin: 0 0 14px;
    text-align: left;
    text-transform: uppercase;
}

.houston-events-hero p {
    color: #07142d;
    font-size: 1.02rem;
    line-height: 1.4;
    margin: 0;
}

.houston-events-band {
    background: #ffffff;
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 24px 64px 20px;
}

.houston-event-card {
    background: #ffffff;
    border: 1px solid #dde2e7;
    border-radius: 7px;
    box-shadow: 0 3px 14px rgba(7, 20, 45, 0.08);
    display: grid;
    gap: 0;
    padding: 10px;
    scroll-margin-top: 110px;
}

.houston-event-card-image {
    aspect-ratio: 5 / 1;
    border-radius: 5px;
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.houston-event-card-body {
    display: grid;
    gap: 12px;
    padding: 14px 4px 0;
}

.houston-event-badge {
    border: 1px solid var(--event-accent, #008a8d);
    border-radius: 999px;
    color: var(--event-accent, #008a8d);
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 900;
    justify-self: start;
    line-height: 1;
    padding: 4px 11px;
    text-transform: uppercase;
}

.houston-event-card h2 {
    color: #07142d;
    font-size: 1.34rem;
    font-weight: 900;
    line-height: 1.1;
    margin: 0;
    text-align: left;
}

.houston-event-summary {
    color: #07142d;
    font-size: 0.9rem;
    line-height: 1.4;
    margin: 0;
    overflow-wrap: anywhere;
}

.houston-event-metrics {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 4px 0 2px;
}

.houston-event-metrics div {
    align-items: center;
    display: grid;
    gap: 2px 9px;
    grid-template-columns: 28px 1fr;
    min-width: 0;
}

.houston-event-metrics span {
    border: 2px solid var(--event-accent, #008a8d);
    border-radius: 50%;
    grid-row: 1 / span 2;
    height: 28px;
    width: 28px;
}

.houston-event-metrics strong,
.houston-event-metrics small {
    color: #07142d;
    display: block;
    line-height: 1.15;
    min-width: 0;
    overflow-wrap: anywhere;
}

.houston-event-metrics strong {
    font-size: 0.84rem;
    font-weight: 900;
}

.houston-event-metrics small {
    font-size: 0.76rem;
}

.houston-event-details {
    display: grid;
    gap: 12px;
    margin-top: 2px;
}

.houston-event-details summary {
    align-items: center;
    border: 2px solid var(--event-accent, #008a8d);
    border-radius: 5px;
    color: var(--event-accent, #008a8d);
    cursor: pointer;
    display: flex;
    font-size: 0.92rem;
    font-weight: 900;
    justify-content: center;
    line-height: 1;
    list-style: none;
    min-height: 39px;
    padding: 9px 16px;
    text-transform: uppercase;
}

.houston-event-details summary::-webkit-details-marker {
    display: none;
}

.houston-event-details summary span {
    font-size: 1.35rem;
    line-height: 0;
    margin-left: 18px;
}

.houston-event-details dl {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-top: 4px;
}

.houston-event-details dl div {
    border-top: 1px solid #e5e9ee;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(120px, 0.35fr) 1fr;
    padding-top: 8px;
}

.houston-event-card dt,
.houston-event-card dd {
    color: #07142d;
    line-height: 1.35;
    margin: 0;
}

.houston-event-card dt {
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.houston-event-card dd {
    font-size: 0.86rem;
}

.houston-site-body .houston-event-link {
    align-items: center;
    border: 2px solid var(--event-accent, #008a8d);
    border-radius: 5px;
    color: var(--event-accent, #008a8d);
    display: flex;
    font-size: 0.92rem;
    font-weight: 900;
    justify-content: center;
    line-height: 1;
    min-height: 39px;
    padding: 9px 16px;
    text-decoration: none;
    text-transform: uppercase;
}

.houston-site-body .houston-event-link span {
    font-size: 1.35rem;
    line-height: 0;
    margin-left: 18px;
}

.houston-site-body .houston-event-link:hover,
.houston-site-body .houston-event-link:focus-visible {
    background: rgba(0, 152, 173, 0.08);
}

.houston-events-trust-strip {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dde2e7;
    border-radius: 7px;
    display: grid;
    gap: 18px;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    margin: 4px 64px 42px;
    padding: 18px 28px;
}

.houston-events-trust-strip div {
    display: grid;
    gap: 4px;
}

.houston-events-trust-strip strong,
.houston-events-trust-strip span {
    color: #07142d;
    line-height: 1.25;
}

.houston-events-trust-strip strong {
    font-size: 0.9rem;
    font-weight: 900;
}

.houston-events-trust-strip span {
    font-size: 0.82rem;
}

.houston-sharks-checkout-hero {
    background: #ffffff;
    border-top: 1px solid #dde2e7;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(320px, 0.9fr) 1fr;
    padding: 36px 64px 26px;
}

.houston-sharks-checkout-hero img {
    aspect-ratio: 5 / 1;
    border-radius: 7px;
    display: block;
    height: auto;
    object-fit: cover;
    width: 100%;
}

.houston-sharks-checkout-hero span {
    border: 1px solid #7b22ff;
    border-radius: 999px;
    color: #7b22ff;
    display: inline-flex;
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
    margin-bottom: 14px;
    padding: 5px 12px;
    text-transform: uppercase;
}

.houston-sharks-checkout-hero h1 {
    color: #07142d;
    font-size: clamp(2.4rem, 4.8vw, 4rem);
    font-weight: 900;
    line-height: 0.95;
    margin: 0 0 12px;
    text-align: left;
    text-transform: uppercase;
}

.houston-sharks-checkout-hero p {
    color: #07142d;
    font-size: 1rem;
    line-height: 1.45;
    margin: 0;
}

.houston-sharks-checkout-layout {
    align-items: start;
    background: #ffffff;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    padding: 0 64px 48px;
}

.houston-sharks-checkout-main {
    display: grid;
    gap: 18px;
}

.houston-sharks-package,
.houston-sharks-addon,
.houston-sharks-summary {
    background: #ffffff;
    border: 1px solid #dde2e7;
    border-radius: 7px;
    box-shadow: 0 3px 14px rgba(7, 20, 45, 0.08);
}

.houston-sharks-package {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 230px);
    padding: 24px;
}

.houston-sharks-package h2,
.houston-sharks-addon-list h2,
.houston-sharks-summary h2 {
    color: #07142d;
    font-size: 1.18rem;
    font-weight: 900;
    line-height: 1.1;
    margin: 0;
    text-align: left;
    text-transform: uppercase;
}

.houston-sharks-package p {
    color: #07142d;
    font-size: 0.92rem;
    line-height: 1.4;
    margin: 9px 0 0;
}

.houston-sharks-quantity {
    align-content: start;
    display: grid;
    gap: 8px;
}

.houston-sharks-quantity label {
    color: #07142d;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.houston-sharks-quantity input {
    border: 2px solid #7b22ff;
    border-radius: 5px;
    box-sizing: border-box;
    color: #07142d;
    font-size: 1.1rem;
    font-weight: 900;
    min-height: 44px;
    padding: 8px 12px;
    width: 100%;
}

.houston-sharks-package dl,
.houston-sharks-addon dl {
    display: grid;
    gap: 8px;
    grid-column: 1 / -1;
    margin: 0;
}

.houston-sharks-package dl div,
.houston-sharks-addon dl div {
    border-top: 1px solid #e5e9ee;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(150px, 0.28fr) 1fr;
    padding-top: 8px;
}

.houston-sharks-package dt,
.houston-sharks-package dd,
.houston-sharks-addon dt,
.houston-sharks-addon dd {
    color: #07142d;
    line-height: 1.35;
    margin: 0;
}

.houston-sharks-package dt,
.houston-sharks-addon dt {
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.houston-sharks-package dd,
.houston-sharks-addon dd {
    font-size: 0.88rem;
}

.houston-sharks-addon-list {
    display: grid;
    gap: 14px;
}

.houston-sharks-addon {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1fr) minmax(170px, 220px);
    padding: 22px;
}

.houston-sharks-addon-copy {
    display: grid;
    gap: 8px;
}

.houston-sharks-addon h3 {
    color: #07142d;
    font-size: 1.02rem;
    font-weight: 900;
    line-height: 1.15;
    margin: 0;
    text-align: left;
}

.houston-sharks-addon p {
    color: #07142d;
    font-size: 0.88rem;
    line-height: 1.4;
    margin: 0;
}

.houston-sharks-summary {
    display: grid;
    gap: 14px;
    padding: 24px;
    position: sticky;
    top: 18px;
}

.houston-sharks-summary div {
    align-items: center;
    border-top: 1px solid #e5e9ee;
    display: flex;
    justify-content: space-between;
    padding-top: 12px;
}

.houston-sharks-summary span,
.houston-sharks-summary strong,
.houston-sharks-summary p {
    color: #07142d;
}

.houston-sharks-summary span {
    font-size: 0.88rem;
}

.houston-sharks-summary strong {
    font-size: 0.95rem;
    font-weight: 900;
}

.houston-sharks-summary-total strong {
    color: #7b22ff;
    font-size: 1.35rem;
}

.houston-sharks-summary p {
    font-size: 0.82rem;
    line-height: 1.4;
    margin: 0;
}

.houston-sharks-summary .houston-site-btn {
    width: 100%;
}

/* Use em breakpoints so browser text scaling preserves the same responsive step. */
@media (max-width: 73.75em) {
    .houston-site-nav {
        gap: 14px;
        grid-template-columns: minmax(172px, 210px) minmax(0, 1fr) auto auto;
        padding-left: 28px;
        padding-right: 28px;
    }

    .houston-site-logo-main {
        font-size: clamp(1.92rem, 2.9vw, 2.2rem);
    }

    .houston-site-logo-sub {
        font-size: 0.8rem;
    }

    .houston-site-menu {
        gap: 14px;
        justify-content: flex-end;
    }

    .houston-site-menu a {
        font-size: 0.84rem;
        padding-left: 5px;
        padding-right: 5px;
    }

    .houston-site-hours {
        gap: 8px;
        justify-content: flex-end;
    }

    .houston-site-hours strong {
        font-size: 0.72rem;
    }

    .houston-site-hours span span {
        font-size: 0.95rem;
    }

    .houston-site-nav-ticket-cta {
        font-size: 0.76rem;
        min-height: 38px;
        padding-left: 12px;
        padding-right: 12px;
    }

    .houston-ticket-band {
        grid-template-columns: minmax(190px, 0.9fr) minmax(180px, 1fr) minmax(180px, 1fr);
    }

    .houston-exhibit-panel {
        grid-column: 1 / -1;
    }

    .houston-visit-band {
        grid-template-columns: minmax(250px, 1fr) minmax(260px, 1fr);
    }

    .houston-map-link {
        grid-column: 1 / -1;
    }

    .houston-site-footer {
        grid-template-columns: minmax(220px, 1fr) minmax(260px, 1fr) minmax(180px, 1fr);
    }

    .houston-events-hero,
    .houston-events-band,
    .houston-sharks-checkout-hero,
    .houston-sharks-checkout-layout {
        padding-left: 28px;
        padding-right: 28px;
    }

    .houston-events-trust-strip {
        margin-left: 28px;
        margin-right: 28px;
    }

    .houston-sharks-checkout-layout {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
    }
}

/* Tighten the single-row header at half-desktop widths so logo, nav, hours, and CTA do not collide. */
@media (max-width: 64em) {
    .houston-site-nav {
        gap: 10px;
        grid-template-columns: minmax(160px, 184px) minmax(0, 1fr) minmax(116px, auto) auto;
        padding-left: 16px;
        padding-right: 16px;
    }

    .houston-site-logo-main {
        font-size: clamp(1.62rem, 2.4vw, 1.86rem);
    }

    .houston-site-logo-sub {
        font-size: 0.62rem;
    }

    .houston-site-menu {
        gap: 8px;
        justify-content: center;
    }

    .houston-site-menu a {
        font-size: 0.76rem;
        padding-left: 4px;
        padding-right: 4px;
    }

    .houston-site-hours {
        gap: 7px;
    }

    .houston-site-hours strong {
        font-size: 0.66rem;
    }

    .houston-site-hours span span {
        font-size: 0.84rem;
    }

    .houston-site-nav-ticket-cta {
        font-size: 0.72rem;
        min-height: 36px;
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* Move nav links onto their own row before the mobile header to avoid cramped tablet collisions. */
@media (max-width: 56.25em) {
    .houston-site-nav {
        gap: 8px 14px;
        grid-template-columns: minmax(160px, 1fr) auto auto;
        min-height: 104px;
        padding-bottom: 12px;
        padding-top: 10px;
    }

    .houston-site-logo {
        grid-column: 1;
        grid-row: 1;
    }

    .houston-site-hours {
        grid-column: 2;
        grid-row: 1;
    }

    .houston-site-nav-ticket-cta {
        grid-column: 3;
        grid-row: 1;
    }

    .houston-site-menu {
        grid-column: 1 / -1;
        grid-row: 2;
        height: auto;
        justify-content: center;
    }

    .houston-site-menu a {
        min-height: 34px;
    }

    .houston-site-menu a::after {
        bottom: 0;
    }
}

/* Use em breakpoints so browser text scaling preserves the same responsive step. */
@media (max-width: 51.25em) {
    .houston-site-nav {
        gap: 14px;
        grid-template-columns: 1fr;
        padding: 16px 22px;
    }

    .houston-site-logo {
        margin: 0 auto;
    }

    .houston-site-menu {
        gap: 8px;
        justify-content: center;
        order: 3;
        overflow-x: auto;
        padding: 2px 0 6px;
    }

    .houston-site-menu a {
        flex: 0 0 auto;
        font-size: 0.76rem;
        min-height: 34px;
        padding: 0 7px;
    }

    .houston-site-menu a::after {
        bottom: 0;
    }

    .houston-site-hours {
        grid-column: auto;
        justify-content: center;
        margin-top: 0;
        order: 2;
    }

    .houston-site-nav-ticket-cta {
        justify-self: center;
        order: 4;
    }

    .houston-site-hero {
        background:
            linear-gradient(90deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.62) 46%, rgba(0, 0, 0, 0.18) 100%),
            url("/static/images/houston/hero.webp") 58% center / cover no-repeat;
        min-height: 490px;
        padding: 42px 22px 58px;
    }

    .houston-site-hero h1 {
        font-size: clamp(2.36rem, 5.4vw, 2.7rem);
        max-width: 390px;
    }

    .houston-site-hero p {
        font-size: 1.08rem;
        max-width: 360px;
    }

    .houston-site-price-strip,
    .houston-site-hero-actions {
        max-width: 100%;
    }

    .houston-ticket-band,
    .houston-visit-band {
        grid-template-columns: 1fr;
        padding-left: 22px;
        padding-right: 22px;
    }

    .houston-ticket-card {
        min-height: 210px;
    }

    .houston-exhibit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .houston-visit-hours {
        border-left: 0;
        border-top: 1px solid #aeb7c1;
        padding: 18px 0 0;
    }

    .houston-site-footer {
        gap: 24px;
        grid-template-columns: 1fr 1fr;
        padding: 28px 22px;
    }

    .houston-events-hero {
        padding: 34px 22px 10px;
    }

    .houston-events-band {
        grid-template-columns: 1fr;
        padding: 24px 22px 18px;
    }

    .houston-events-trust-strip {
        grid-template-columns: 1fr 1fr;
        margin: 4px 22px 34px;
        padding: 18px;
    }

    .houston-sharks-checkout-hero,
    .houston-sharks-checkout-layout,
    .houston-sharks-package,
    .houston-sharks-addon {
        grid-template-columns: 1fr;
    }

    .houston-sharks-checkout-hero {
        padding: 30px 22px 20px;
    }

    .houston-sharks-checkout-layout {
        padding: 0 22px 40px;
    }

    .houston-sharks-summary {
        position: static;
    }
}

/* Use em breakpoints so browser text scaling preserves the same responsive step. */
@media (max-width: 32.5em) {
    .houston-site-logo-main {
        font-size: clamp(1.72rem, 7vw, 2rem);
    }

    .houston-site-logo-sub {
        font-size: 0.78rem;
    }

    .houston-site-menu {
        justify-content: flex-start;
    }

    .houston-site-hero {
        min-height: 520px;
    }

    .houston-site-hero h1 {
        font-size: clamp(2.08rem, 8vw, 2.18rem);
    }

    .houston-site-price-strip {
        grid-template-columns: 1fr;
    }

    .houston-site-price-strip div + div {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.86);
    }

    .houston-site-hero-actions {
        grid-template-columns: 1fr;
    }

    .houston-exhibit-grid,
    .houston-site-footer {
        grid-template-columns: 1fr;
    }

    .houston-visit-hours div {
        gap: 14px;
        grid-template-columns: 68px 1fr;
    }

    .houston-event-card {
        padding: 8px;
    }

    .houston-event-metrics {
        grid-template-columns: 1fr;
    }

    .houston-event-details dl div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .houston-events-trust-strip {
        grid-template-columns: 1fr;
    }

    .houston-sharks-package,
    .houston-sharks-addon,
    .houston-sharks-summary {
        padding: 18px;
    }

    .houston-sharks-package dl div,
    .houston-sharks-addon dl div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* Use em breakpoints so browser text scaling preserves the same responsive step. */
@media (max-width: 48em) {
    .houston-site-nav {
        align-items: center;
        display: grid;
        gap: 10px;
        grid-template-columns: 1fr;
        min-height: auto;
        padding: 18px 18px;
    }

    .houston-site-nav::after {
        content: none;
        display: none;
    }

    .houston-site-logo {
        grid-column: 1;
        justify-self: center;
        margin: 0;
        transform: none;
        width: 80%;
    }

    .houston-site-logo .houston-site-logo-image {
        width: 100%;
    }

    .houston-site-logo-main {
        font-size: clamp(2.45rem, 10.8vw, 3.9rem);
        justify-content: center;
        width: 100%;
    }

    .houston-site-logo-sub {
        font-size: clamp(0.86rem, 3.35vw, 1.24rem);
    }

    .houston-site-menu {
        display: none;
    }

    .houston-site-menu-toggle {
        background:
            linear-gradient(#07142d, #07142d) left top / 34px 4px no-repeat,
            linear-gradient(#07142d, #07142d) left center / 34px 4px no-repeat,
            linear-gradient(#07142d, #07142d) left bottom / 34px 4px no-repeat;
        border: 0;
        border-radius: 0;
        cursor: pointer;
        display: block;
        height: 24px;
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
        padding: 0;
        width: 34px;
    }

    .houston-site-menu-toggle:focus-visible {
        outline: 3px solid #0098ad;
        outline-offset: 5px;
    }

    .houston-site-menu-toggle span {
        display: none;
    }

    .houston-site-nav.is-menu-open .houston-site-menu {
        background: #ffffff;
        border-top: 1px solid #dde2e7;
        box-shadow: 0 14px 24px rgba(7, 20, 45, 0.1);
        display: grid;
        gap: 0;
        grid-column: 1 / -1;
        grid-row: 2;
        grid-template-columns: 1fr;
        height: auto;
        justify-content: stretch;
        justify-items: stretch;
        margin: 10px -18px -18px;
        overflow: visible;
        padding: 8px 18px 14px;
    }

    .houston-site-nav.is-menu-open .houston-site-menu > a,
    .houston-site-nav.is-menu-open .houston-site-menu-item > a {
        border-radius: 5px;
        box-sizing: border-box;
        justify-content: flex-start;
        min-height: 42px;
        padding: 0 10px;
        width: 100%;
    }

    .houston-site-nav.is-menu-open .houston-site-menu a::after {
        display: none;
    }

    .houston-site-nav.is-menu-open .houston-site-menu-item {
        display: grid;
        height: auto;
        width: 100%;
    }

    .houston-site-nav.is-menu-open .houston-site-menu-dropdown {
        background: rgba(0, 152, 173, 0.06);
        border: 0;
        border-radius: 5px;
        box-sizing: border-box;
        box-shadow: none;
        display: grid;
        left: auto;
        min-width: 0;
        opacity: 1;
        padding: 4px;
        pointer-events: auto;
        position: static;
        transform: none;
        visibility: visible;
        width: 100%;
    }

    .houston-site-nav.is-menu-open .houston-site-menu-dropdown a {
        font-size: 0.76rem;
        min-height: 36px;
        padding-left: 14px;
        text-transform: none;
        white-space: normal;
    }

    .houston-site-hours {
        gap: 8px;
        grid-column: 2;
        justify-content: end;
        margin: 0;
        order: initial;
        white-space: nowrap;
    }

    .houston-site-nav-ticket-cta {
        display: none;
    }

    .houston-site-hours strong {
        font-size: 0.72rem;
    }

    .houston-site-hours span span {
        font-size: 0.88rem;
    }

    .houston-site-hero {
        background:
            linear-gradient(90deg, rgba(2, 13, 26, 1) 0%, rgba(2, 13, 26, 0.96) 34%, rgba(2, 13, 26, 0.76) 62%, rgba(2, 13, 26, 0.22) 100%),
            linear-gradient(180deg, rgba(2, 13, 26, 0.04) 0%, rgba(2, 13, 26, 0.42) 100%),
            url("/static/images/houston/hero.webp") 76% center / cover no-repeat;
        min-height: 0;
        padding: 100px 22px 72px;
    }

    .houston-site-hero::after {
        bottom: -22px;
        height: 76px;
    }

    .houston-site-hero-copy {
        align-self: start;
        max-width: 100%;
    }

    .houston-site-hero h1 {
        font-size: clamp(2.38rem, 10.75vw, 2.78rem);
        line-height: 1.04;
        margin-bottom: 20px;
        max-width: 340px;
    }

    .houston-site-hero h1 span {
        display: block;
    }

    .houston-site-hero p {
        font-size: 1.22rem;
        line-height: 1.42;
        margin-bottom: 22px;
        max-width: 325px;
    }

    .houston-site-price-strip {
        background: rgba(3, 18, 34, 0.82);
        border: 1px solid rgba(255, 255, 255, 0.78);
        border-radius: 12px;
        box-shadow: 0 18px 44px rgba(0, 0, 0, 0.34);
        display: grid;
        grid-template-columns: 1fr;
        margin: 0 0 22px;
        max-width: 300px;
        min-height: 0;
        padding: 8px 18px;
    }

    .houston-site-hero-sws-cta {
        width: min(100%, 325px);
    }

    .houston-site-price-strip div {
        display: grid;
        gap: 0 13px;
        grid-template-columns: 38px 1fr;
        justify-items: start;
        min-height: 0;
        padding: 7px 0;
        text-align: left;
    }

    .houston-site-price-strip div::before {
        align-self: center;
        border: 3px solid #00a8c8;
        border-radius: 50%;
        content: "";
        grid-column: 1;
        grid-row: 1 / span 3;
        height: 32px;
        justify-self: center;
        width: 32px;
    }

    .houston-site-price-strip div + div {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.76);
    }

    .houston-site-price-strip span,
    .houston-site-price-strip strong,
    .houston-site-price-strip small {
        grid-column: 2;
    }

    .houston-site-price-strip span {
        font-size: 0.78rem;
        line-height: 1.1;
    }

    .houston-site-price-strip strong {
        font-size: 1.4rem;
        line-height: 1.04;
    }

    .houston-site-price-strip div:nth-child(2) strong {
        font-size: 1.7rem;
    }

    .houston-site-price-strip small {
        font-size: 0.8rem;
        line-height: 1.14;
    }

    .houston-site-hero-actions {
        gap: 14px;
        grid-template-columns: 1fr;
        max-width: 100%;
    }

    .houston-site-hero-actions .houston-site-btn {
        border-radius: 10px;
        font-size: 1.22rem;
        min-height: 58px;
        padding: 14px 60px 14px 24px;
        position: relative;
        width: 100%;
    }

    .houston-site-hero-actions .houston-site-btn::after {
        content: "\2192";
        font-size: 2rem;
        font-weight: 700;
        line-height: 1;
        position: absolute;
        right: 32px;
        top: 50%;
        transform: translateY(-50%);
    }
}

/* Keep the compact mobile header and checkout cards inside narrow phone viewports. */
@media (max-width: 32.5em) {
    .houston-site-nav {
        gap: 7px;
        padding-left: 16px;
        padding-right: 16px;
    }

    .houston-site-menu-toggle {
        background:
            linear-gradient(#07142d, #07142d) left top / 30px 3px no-repeat,
            linear-gradient(#07142d, #07142d) left center / 30px 3px no-repeat,
            linear-gradient(#07142d, #07142d) left bottom / 30px 3px no-repeat;
        height: 22px;
        right: 16px;
        width: 30px;
    }

    .houston-site-nav.is-menu-open .houston-site-menu {
        margin-left: -16px;
        margin-right: -16px;
        padding-left: 16px;
        padding-right: 16px;
    }

    .houston-site-logo-main {
        font-size: clamp(1.5rem, 6.4vw, 1.68rem);
    }

    .houston-site-logo-sub {
        font-size: 0.58rem;
    }

    .houston-site-hours {
        gap: 6px;
        min-width: 0;
    }

    .houston-site-hours > span {
        min-width: 0;
    }

    .houston-site-hours strong {
        font-size: 0.64rem;
    }

    .houston-site-hours span span {
        font-size: 0.8rem;
    }

    .houston-sharks-checkout-hero,
    .houston-sharks-checkout-layout {
        padding-left: 18px;
        padding-right: 18px;
    }

    .houston-sharks-checkout-main,
    .houston-sharks-package,
    .houston-sharks-addon,
    .houston-sharks-summary,
    .houston-sharks-quantity {
        min-width: 0;
    }

    .houston-sharks-quantity input {
        max-width: 100%;
        min-width: 0;
    }

    .houston-sharks-checkout-hero p,
    .houston-sharks-package p,
    .houston-sharks-addon p,
    .houston-sharks-package dd,
    .houston-sharks-addon dd {
        overflow-wrap: anywhere;
    }
}

/* Dark Houston site palette and events redesign. */
body.houston-site-body {
    --houston-bg: #1d1d1a;
    --houston-bg-soft: #242420;
    --houston-card: #2b2c29;
    --houston-card-soft: #252622;
    --houston-line: rgba(255, 255, 255, 0.13);
    --houston-line-strong: rgba(255, 255, 255, 0.23);
    --houston-text: #f6f1e7;
    --houston-muted: #aaa69d;
    --houston-muted-2: #d8d2c4;
    --houston-teal: #18b991;
    --houston-coral: #d85a30;
    --houston-coral-hover: #c74e27;
    --houston-coral-shadow: rgba(216, 90, 48, 0.3);
    --houston-amber: #ef9f27;
    --houston-amber-text: #412402;
    --houston-member-green: #1d9e75;
    --houston-non-member-gray: #8c8a83;
    --houston-ticket-accent: #46ad55;
    --houston-ticket-accent-border: rgba(70, 173, 85, 0.6);
    --houston-ticket-accent-glow: rgba(70, 173, 85, 0.18);
    --houston-ticket-primary: #f59425;
    --houston-ticket-primary-hover: #e07f12;
    --houston-ticket-primary-shadow: rgba(245, 148, 37, 0.3);
    --houston-max: 1180px;
    background:
        radial-gradient(circle at 12% 4%, rgba(8, 58, 99, 0.28), transparent 31rem),
        radial-gradient(circle at 92% 12%, rgba(24, 185, 145, 0.1), transparent 26rem),
        var(--houston-bg);
    color: var(--houston-text);
}

.houston-site-page {
    background:
        radial-gradient(circle at 12% 4%, rgba(8, 58, 99, 0.28), transparent 31rem),
        radial-gradient(circle at 92% 12%, rgba(24, 185, 145, 0.1), transparent 26rem),
        var(--houston-bg);
}

.houston-site-nav {
    background: rgba(26, 26, 23, 0.92);
    border-bottom: 1px solid var(--houston-line);
    gap: 24px;
    grid-template-columns: 470px minmax(0, 1fr) auto auto;
    min-height: 78px;
    padding: 16px 64px;
    position: sticky;
    top: 0;
}

@supports (backdrop-filter: blur(16px)) {
    .houston-site-nav {
        backdrop-filter: blur(16px);
        background: rgba(26, 26, 23, 0.86);
    }
}

.houston-site-logo,
.houston-site-footer-logo {
    color: #ffffff;
}

.houston-site-logo {
    justify-self: center;
}

.houston-site-logo-main {
    color: #ffffff;
    font-size: clamp(1.62rem, 2.5vw, 1.82rem);
}

.houston-site-logo-o {
    border-color: #ffffff;
}

.houston-site-logo-o::after {
    background: var(--houston-teal);
}

.houston-site-logo-sub {
    color: var(--houston-teal);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
}

.houston-site-menu {
    gap: 28px;
}

.houston-site-menu a {
    color: #d9d4cb;
    font-size: 0.82rem;
    letter-spacing: 0.02em;
    opacity: 0.82;
}

.houston-site-menu a.is-active,
.houston-site-menu a:hover,
.houston-site-menu a:focus-visible {
    opacity: 1;
}

.houston-site-menu a.is-active::after,
.houston-site-menu a:hover::after {
    background: var(--houston-teal);
}

.houston-site-menu-dropdown {
    background: #252622;
    border-color: var(--houston-line);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36);
}

.houston-site-menu-dropdown a {
    color: var(--houston-muted-2);
}

.houston-site-menu-dropdown a:hover,
.houston-site-menu-dropdown a:focus-visible {
    background: rgba(24, 185, 145, 0.12);
    color: #ffffff;
}

.houston-site-hours {
    color: var(--houston-muted-2);
}

@media (max-width: 82em) {
    .houston-site-hours,
    .houston-site-nav-ticket-cta {
        display: none;
    }
}

@media (max-width: 68.75em) {
    .houston-site-nav {
        gap: 14px;
        grid-template-columns: minmax(148px, 170px) minmax(0, 1fr) auto;
        min-height: 78px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .houston-site-logo,
    .houston-site-menu,
    .houston-site-nav-ticket-cta {
        grid-column: auto;
        grid-row: auto;
    }

    .houston-site-logo-main {
        font-size: clamp(1.36rem, 2.1vw, 1.58rem);
    }

    .houston-site-logo-sub {
        font-size: 0.56rem;
    }

    .houston-site-menu {
        gap: 14px;
        height: 100%;
        justify-content: center;
    }

    .houston-site-menu a {
        font-size: 0.74rem;
        padding-left: 3px;
        padding-right: 3px;
    }

    .houston-site-hours {
        display: none;
    }

    .houston-site-nav-ticket-cta {
        font-size: 0.72rem;
        min-height: 38px;
        padding-left: 12px;
        padding-right: 12px;
    }
}

@media (max-width: 52em) {
    .houston-site-nav {
        gap: 10px 16px;
        grid-template-columns: minmax(148px, 1fr) auto;
        min-height: 94px;
    }

    .houston-site-logo {
        grid-column: 1;
        grid-row: 1;
    }

    .houston-site-nav-ticket-cta {
        grid-column: 2;
        grid-row: 1;
    }

    .houston-site-menu {
        grid-column: 1 / -1;
        grid-row: 2;
        height: auto;
        justify-content: center;
    }

    .houston-site-menu a {
        min-height: 30px;
    }

    .houston-site-menu a::after {
        bottom: 0;
    }

    .houston-site-hours {
        display: none;
    }
}

.houston-site-btn-primary {
    background: var(--houston-coral);
    border-color: var(--houston-coral);
    box-shadow: 0 12px 28px var(--houston-coral-shadow);
    color: #ffffff;
}

.houston-site-btn-primary:hover,
.houston-site-btn-primary:focus-visible {
    background: var(--houston-coral-hover);
    border-color: var(--houston-coral-hover);
    box-shadow: 0 16px 34px rgba(216, 90, 48, 0.38);
}

.houston-site-btn-secondary {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.9);
    color: var(--houston-text);
}

.houston-site-btn-secondary:hover,
.houston-site-btn-secondary:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.46);
}

.houston-site-hero::after {
    background: var(--houston-bg);
}

.houston-site-price-strip div:nth-child(2) strong {
    color: var(--houston-coral);
}

.houston-ticket-band,
.houston-visit-band {
    background: transparent;
}

.houston-ticket-intro h2,
.houston-exhibit-panel h2,
.houston-visit-info h2 {
    color: var(--houston-text);
}

.houston-ticket-intro p,
.houston-ticket-card p,
.houston-visit-detail p,
.houston-visit-hours dt,
.houston-visit-hours dd {
    color: var(--houston-muted-2);
}

.houston-digital-badge {
    color: var(--houston-ticket-accent);
}

.houston-digital-badge span,
.houston-ticket-ribbon {
    background: var(--houston-ticket-accent);
}

.houston-ticket-ribbon::before {
    border-right-color: var(--houston-ticket-accent);
}

.houston-ticket-ribbon::after {
    border-left-color: var(--houston-ticket-accent);
}

.houston-ticket-card,
.houston-exhibit-card {
    background: var(--houston-card);
    border-color: var(--houston-line);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}

.houston-ticket-card h3,
.houston-exhibit-card h3 {
    color: var(--houston-text);
}

.houston-ticket-price {
    color: var(--houston-ticket-accent) !important;
}

.houston-ticket-card-featured {
    border-color: var(--houston-ticket-accent-border);
    box-shadow: 0 0 0 1px var(--houston-ticket-accent-glow), 0 18px 48px rgba(0, 0, 0, 0.24);
}

.houston-site-body .houston-ticket-card .houston-site-btn.houston-site-btn-primary,
.houston-site-body .houston-ticket-card .houston-site-btn.houston-site-btn-primary:visited {
    background: var(--houston-ticket-primary);
    border-color: var(--houston-ticket-primary);
    box-shadow: 0 12px 28px var(--houston-ticket-primary-shadow);
    color: #ffffff;
}

.houston-site-body .houston-ticket-card .houston-site-btn.houston-site-btn-primary:hover,
.houston-site-body .houston-ticket-card .houston-site-btn.houston-site-btn-primary:focus-visible {
    background: var(--houston-ticket-primary-hover);
    border-color: var(--houston-ticket-primary-hover);
    box-shadow: 0 16px 34px rgba(245, 148, 37, 0.38);
}

.houston-visit-band {
    border-top-color: var(--houston-line);
}

.houston-icon {
    color: var(--houston-text);
}

.houston-icon-pin::before {
    background: var(--houston-coral);
}

.houston-icon-pin::after {
    background: var(--houston-card);
}

.houston-icon-phone {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M22%2016.92v3a2%202%200%200%201-2.18%202%2019.79%2019.79%200%200%201-8.63-3.07%2019.5%2019.5%200%200%201-6-6%2019.79%2019.79%200%200%201-3.07-8.67A2%202%200%200%201%204.11%202h3a2%202%200%200%201%202%201.72c.12.91.33%201.8.62%202.65a2%202%200%200%201-.45%202.11L8.09%209.91a16%2016%200%200%200%206%206l1.43-1.19a2%202%200%200%201%202.11-.45c.85.29%201.74.5%202.65.62A2%202%200%200%201%2022%2016.92z%22%20stroke%3D%22%23f6f1e7%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") center / 32px 32px no-repeat;
}

.houston-icon-email {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%20stroke%3D%22%23f6f1e7%22%20stroke-width%3D%222.5%22/%3E%3Cpath%20d%3D%22M4%207l8%206%208-6%22%20stroke%3D%22%23f6f1e7%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E") center / 32px 32px no-repeat;
}

.houston-visit-hours {
    border-left-color: var(--houston-line-strong);
}

.houston-map-link {
    border: 1px solid var(--houston-line);
}

.houston-site-footer {
    background: #171814;
    border-top: 1px solid var(--houston-line);
}

.houston-site-footer h2,
.houston-site-copyright,
.houston-footer-column a {
    color: var(--houston-text);
}

.houston-events-main {
    margin: 0 auto;
    max-width: var(--houston-max);
    padding: 24px 22px 44px;
    min-width: 0;
}

.houston-events-page .houston-events-hero {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 28px),
        linear-gradient(135deg, #073456 0%, #082d4d 47%, #0b2740 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
    min-height: 390px;
    overflow: hidden;
    padding: clamp(32px, 6vw, 58px);
    position: relative;
}

.houston-events-page .houston-events-hero::after {
    background: radial-gradient(circle, rgba(24, 185, 145, 0.24), transparent 68%);
    border-radius: 50%;
    bottom: -210px;
    content: "";
    height: 420px;
    pointer-events: none;
    position: absolute;
    right: -130px;
    width: 420px;
}

.houston-events-eyebrow {
    color: #50d0b8 !important;
    font-size: 0.82rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.17em;
    margin: 0 0 18px !important;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.houston-events-page .houston-events-hero h1 {
    color: #fffaf0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.875rem, 8vw, 4.75rem);
    font-weight: 900;
    letter-spacing: -0.045em;
    line-height: 0.96;
    margin: 0;
    max-width: 650px;
    text-align: left;
    text-transform: none;
    overflow-wrap: anywhere;
}

.houston-events-page .houston-events-hero p:not(.houston-events-eyebrow) {
    color: rgba(246, 241, 231, 0.68);
    font-size: clamp(1.125rem, 2.4vw, 1.5rem);
    font-weight: 650;
    margin: 26px 0 0;
    max-width: 640px;
    overflow-wrap: anywhere;
}

.houston-events-open-pill {
    align-items: center;
    background: rgba(2, 20, 34, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    color: rgba(246, 241, 231, 0.72);
    display: inline-flex;
    font-weight: 750;
    gap: 10px;
    margin-top: 36px;
    min-height: 44px;
    padding: 0 22px;
}

.houston-events-open-pill::before {
    background: var(--houston-teal);
    border-radius: 50%;
    box-shadow: 0 0 0 6px rgba(24, 185, 145, 0.12);
    content: "";
    height: 10px;
    width: 10px;
}

.houston-events-section {
    margin-top: 48px;
}

.houston-events-section-heading {
    align-items: center;
    color: #c9c1b2;
    display: grid;
    font-size: 0.875rem;
    font-weight: 950;
    gap: 16px;
    grid-template-columns: auto 1fr;
    letter-spacing: 0.16em;
    margin: 0 0 22px;
    text-transform: uppercase;
}

.houston-events-section-heading::after {
    background: var(--houston-line);
    content: "";
    height: 1px;
}

.houston-events-grid {
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    position: relative;
}

.houston-events-grid.is-special {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.96fr);
}

.houston-events-grid.is-trio {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.houston-events-anchor {
    height: 1px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: -96px;
    width: 1px;
}

.houston-event-experience-card,
.houston-events-info-card,
.houston-events-cta-band,
.houston-events-trust-strip {
    background: var(--houston-card);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}

.houston-event-experience-card {
    display: grid;
    grid-template-rows: 260px 1fr;
    min-width: 0;
    overflow: hidden;
    scroll-margin-top: 110px;
}

.houston-event-experience-card.is-featured {
    border-color: rgba(24, 185, 145, 0.6);
    box-shadow: 0 0 0 1px rgba(24, 185, 145, 0.18), 0 18px 48px rgba(0, 0, 0, 0.24);
}

.houston-events-art-band {
    display: grid;
    font-size: 3rem;
    isolation: isolate;
    line-height: 1;
    place-items: center;
    position: relative;
}

.houston-events-art-band::before {
    background:
        radial-gradient(circle at 22% 26%, rgba(255, 255, 255, 0.08), transparent 16rem),
        linear-gradient(140deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 26px);
    content: "";
    inset: 0;
    position: absolute;
    z-index: -1;
}

.houston-events-art-forest {
    background: linear-gradient(135deg, #0f3d27, #113b2b 56%, #0e4a38);
}

.houston-events-art-ocean {
    background: linear-gradient(135deg, #0a3564, #063d5b 54%, #064a49);
}

.houston-events-art-royal {
    background: linear-gradient(135deg, #55105f, #6d0f71 55%, #7a1662);
}

.houston-events-art-image {
    background: #062b48;
    overflow: hidden;
}

.houston-events-art-image img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

/* Princess Makeover card: let the art band match the image's 4:3 ratio so the
   full scene — including the bows along the bottom — shows without cropping. */
#princess-makeover {
    grid-template-rows: auto 1fr;
}

#princess-makeover .houston-events-art-image {
    aspect-ratio: 4 / 3;
}

#princess-makeover .houston-events-art-image img {
    object-position: center bottom;
}

.houston-events-card-body {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
    padding: 26px;
}

.houston-events-card-topline {
    align-items: center;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    min-height: 32px;
}

.houston-events-tag {
    align-items: center;
    background: #effff9;
    border-radius: 999px;
    color: #2b8b72;
    display: inline-flex;
    font-size: 0.75rem;
    font-weight: 950;
    justify-content: center;
    letter-spacing: 0.1em;
    padding: 5px 12px;
    text-transform: uppercase;
}

.houston-events-tag.is-blue {
    background: #eff8ff;
    color: #406f9d;
}

.houston-events-tag.is-pink {
    background: #fff1f6;
    color: #be476b;
}

.houston-events-availability {
    background: #ffeaf4;
    border-radius: 999px;
    color: #b84b77;
    font-size: 0.75rem;
    font-weight: 900;
    padding: 5px 11px;
}

.houston-event-experience-card h2 {
    color: #fff8eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.75rem;
    letter-spacing: -0.035em;
    line-height: 1.08;
    margin: 0;
    text-align: left;
}

.houston-events-description {
    color: var(--houston-muted);
    font-size: 1rem;
    font-weight: 680;
    margin: 0;
}

.houston-events-stats {
    border-top: 1px solid var(--houston-line);
    display: grid;
    gap: 14px 22px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-top: 16px;
}

.houston-events-stats span {
    color: var(--houston-muted);
    display: block;
    font-size: 0.82rem;
    font-weight: 850;
}

.houston-events-stats strong {
    color: var(--houston-text);
    display: block;
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.2;
}

.houston-events-price-row {
    align-items: end;
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.houston-events-price {
    color: #ffffff;
    font-size: 1.75rem;
    font-weight: 950;
    letter-spacing: -0.04em;
    line-height: 1;
}

.houston-events-price small {
    color: var(--houston-muted);
    font-size: 0.82rem;
    font-weight: 850;
    letter-spacing: 0;
}

.houston-events-price.is-member {
    color: var(--houston-member-green);
    text-shadow: 0 0 24px rgba(29, 158, 117, 0.2);
}

.houston-events-price.is-member small {
    color: rgba(209, 239, 229, 0.8);
}

.houston-events-price.is-non-member {
    color: var(--houston-non-member-gray);
    text-decoration: line-through;
    text-decoration-color: rgba(140, 138, 131, 0.72);
    text-decoration-thickness: 2px;
}

.houston-events-save-note {
    align-items: center;
    background: var(--houston-amber);
    border-radius: 999px;
    box-shadow: 0 10px 22px rgba(239, 159, 39, 0.2);
    color: var(--houston-amber-text);
    display: flex;
    font-size: 0.82rem;
    font-weight: 950;
    justify-content: center;
    min-height: 34px;
}

.houston-events-card-actions {
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) 136px;
    margin-top: auto;
}

/* Single-action cards (snorkeling, pickleball, arcade): center the lone button
   instead of leaving it pinned to the first grid column. */
.houston-events-card-actions:has(> .houston-events-btn:only-child) {
    grid-template-columns: auto;
    justify-content: center;
}

.houston-events-btn {
    align-items: center;
    border: 1px solid var(--houston-line-strong);
    border-radius: 10px;
    color: var(--houston-text);
    cursor: pointer;
    display: inline-flex;
    font-size: 1rem;
    font-weight: 850;
    gap: 10px;
    justify-content: center;
    line-height: 1.2;
    min-height: 46px;
    padding: 8px 18px;
    text-align: center;
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, color 180ms ease;
}

.houston-events-btn:hover,
.houston-events-btn:focus-visible {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.42);
    transform: translateY(-1px);
}

.houston-events-btn.is-fill {
    background: var(--houston-coral);
    border-color: transparent;
    box-shadow: 0 12px 28px var(--houston-coral-shadow);
    color: #ffffff;
}

.houston-events-btn.is-fill:hover,
.houston-events-btn.is-fill:focus-visible {
    background: var(--houston-coral-hover);
    border-color: transparent;
    box-shadow: 0 16px 34px rgba(216, 90, 48, 0.38);
}

.houston-events-btn.is-ghost {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.26);
    color: var(--houston-muted-2);
    width: 100%;
}

.houston-events-btn.is-ghost:hover,
.houston-events-btn.is-ghost:focus-visible {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.46);
    color: #ffffff;
}

.houston-events-side-stack {
    display: grid;
    gap: 22px;
    grid-template-rows: 1fr auto;
}

.houston-events-side-stack.is-fullrow {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
}

.houston-events-info-card {
    padding: 34px;
}

.houston-events-info-card h3 {
    color: var(--houston-teal);
    font-size: 0.82rem;
    font-weight: 950;
    letter-spacing: 0.14em;
    margin: 0 0 20px;
    text-transform: uppercase;
}

.houston-events-check-list {
    color: var(--houston-muted-2);
    display: grid;
    font-size: 1.06rem;
    font-weight: 650;
    gap: 14px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.houston-events-check-list li {
    align-items: flex-start;
    display: flex;
    gap: 12px;
}

.houston-events-check-list li::before {
    align-items: center;
    border: 2px solid var(--houston-teal);
    border-radius: 50%;
    color: var(--houston-teal);
    content: "\2713";
    display: inline-flex;
    flex: 0 0 20px;
    font-size: 0.75rem;
    font-weight: 950;
    height: 20px;
    justify-content: center;
    line-height: 1;
    margin-top: 2px;
}

.houston-events-phone-card {
    padding: 28px 34px;
}

.houston-events-phone-card p {
    color: var(--houston-muted-2);
    font-size: 1rem;
    margin: 0;
}

.houston-events-phone-card b {
    color: #ffffff;
    display: block;
    font-size: 1.75rem;
    letter-spacing: -0.035em;
    margin: 6px 0 2px;
}

.houston-events-cta-band {
    align-items: center;
    background: linear-gradient(135deg, #083253, #062b48);
    border-color: rgba(9, 70, 118, 0.65);
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr auto;
    margin-top: 52px;
    padding: 34px 42px;
}

.houston-events-cta-band h3 {
    color: #ffffff;
    font-size: 1.5rem;
    letter-spacing: -0.02em;
    line-height: 1.16;
    margin: 0 0 4px;
}

.houston-events-cta-band p {
    color: rgba(246, 241, 231, 0.66);
    font-size: 1.06rem;
    font-weight: 650;
    margin: 0;
}

.houston-events-cta-band .houston-events-btn {
    min-width: 190px;
}

.houston-events-page .houston-events-trust-strip {
    background: rgba(37, 38, 34, 0.88);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 36px 0 0;
    overflow: hidden;
    padding: 0;
}

.houston-events-trust-item {
    border-right: 1px solid var(--houston-line);
    display: grid;
    min-height: 160px;
    padding: 28px 18px;
    place-items: center;
    text-align: center;
}

.houston-events-trust-item:last-child {
    border-right: 0;
}

.houston-events-trust-item span {
    color: var(--houston-teal);
    display: block;
    font-size: 1.55rem;
    margin-bottom: 12px;
}

.houston-events-trust-item b {
    color: #fff6ea;
    display: block;
    font-size: 0.94rem;
    margin-bottom: 4px;
}

.houston-events-trust-item small {
    color: var(--houston-muted);
    display: block;
    font-size: 0.82rem;
    font-weight: 650;
    line-height: 1.35;
    max-width: 180px;
}

.houston-info-main {
    padding-bottom: 58px;
}

.houston-info-hero {
    min-height: 300px;
}

.houston-info-toc {
    background: rgba(37, 38, 34, 0.88);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 20px 0 30px;
    padding: 14px;
    position: sticky;
    top: 92px;
    z-index: 4;
}

.houston-info-toc a {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--houston-line);
    border-radius: 999px;
    color: var(--houston-teal);
    font-size: 0.82rem;
    font-weight: 900;
    min-height: 34px;
    padding: 7px 14px;
    text-decoration: none;
}

.houston-info-toc a:hover,
.houston-info-toc a:focus-visible {
    border-color: var(--houston-teal);
    color: #ffffff;
}

.houston-info-section {
    background: var(--houston-card);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
    margin-bottom: 22px;
    padding: 30px 34px;
    scroll-margin-top: 160px;
}

.houston-info-section h2 {
    color: #fff8eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.68rem;
    font-weight: 950;
    letter-spacing: -0.025em;
    line-height: 1.1;
    margin: 0 0 14px;
}

.houston-info-section p,
.houston-info-section li,
.houston-info-section td {
    color: var(--houston-muted-2);
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.55;
}

.houston-info-section p {
    margin: 0;
    max-width: 74ch;
}

.houston-info-section p + p {
    margin-top: 12px;
}

.houston-info-section strong {
    color: #fff8eb;
}

/* Operative rule, surfaced first and marked with an accent rule. */
.houston-info-section .houston-info-lead {
    color: #fff8eb;
    font-size: 1.08rem;
    font-weight: 760;
    line-height: 1.5;
    max-width: 64ch;
    border-left: 2px solid var(--houston-teal);
    padding-left: 16px;
    margin: 0 0 16px;
}

/* Supporting / legal elaboration, demoted beneath the lead. */
.houston-info-section .houston-info-detail {
    color: var(--houston-muted-2);
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.55;
    max-width: 64ch;
    margin: 12px 0 0;
}

.houston-info-hours-grid {
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 0.9fr) minmax(280px, 1fr);
    margin-top: 18px;
}

.houston-info-address {
    color: var(--houston-muted-2);
    font-style: normal;
    font-weight: 620;
    line-height: 1.55;
}

.houston-info-address strong {
    color: #fff8eb;
    display: block;
    margin-bottom: 4px;
}

.houston-info-hours-table {
    border-collapse: collapse;
    width: 100%;
}

.houston-info-hours-table td {
    border-bottom: 1px solid var(--houston-line);
    padding: 10px 0;
}

.houston-info-hours-table td:last-child {
    color: #fff8eb;
    font-weight: 950;
    text-align: right;
}

.houston-info-link {
    color: var(--houston-teal);
    font-weight: 950;
    text-decoration: none;
}

.houston-info-link:hover,
.houston-info-link:focus-visible {
    text-decoration: underline;
}

.houston-info-section ul {
    display: grid;
    gap: 8px;
    margin: 12px 0 0;
    padding-left: 20px;
}

.houston-info-animals {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    margin-top: 18px;
}

.houston-info-animal {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 18px 20px;
}

.houston-info-animal h3 {
    color: var(--houston-teal);
    font-size: 0.88rem;
    font-weight: 950;
    letter-spacing: 0.1em;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.houston-info-animal ul {
    margin: 0;
    padding-left: 20px;
}

.houston-info-note {
    background: rgba(232, 96, 44, 0.13);
    border: 1px solid rgba(232, 96, 44, 0.34);
    border-radius: 12px;
    color: #ffd8c8;
    font-size: 0.95rem;
    font-weight: 760;
    line-height: 1.45;
    margin-top: 16px;
    padding: 16px 20px;
}

/* Park-info pages flag the note with a warning icon (icon + span markup). */
.houston-info-page .houston-info-note {
    align-items: flex-start;
    border-left: 3px solid var(--houston-coral);
    display: flex;
    gap: 13px;
    max-width: 64ch;
}

.houston-info-page .houston-info-note svg {
    flex: none;
    margin-top: 2px;
    stroke: var(--houston-coral);
}

.houston-info-page .houston-info-note span {
    display: block;
}

/* --- Readability pass: light Fraunces/Inter typography on the park-info pages.
   Keeps the site's dark theme + per-venue accent; only the type weight/scale
   is lifted to match the readable mockup. --- */
.houston-info-page .houston-info-hero,
.houston-info-page .houston-info-toc,
.houston-info-page .houston-info-section,
.houston-info-page .houston-info-address {
    font-family: "Inter", system-ui, -apple-system, sans-serif;
}

.houston-info-page .houston-events-hero h1,
.houston-info-page .houston-info-section h2 {
    font-family: "Fraunces", Georgia, "Times New Roman", serif;
}

.houston-info-page .houston-events-hero h1 {
    font-weight: 600;
    letter-spacing: -0.015em;
}

.houston-info-page .houston-events-hero p:not(.houston-events-eyebrow) {
    font-weight: 400;
}

.houston-info-page .houston-info-section h2 {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -0.005em;
}

.houston-info-page .houston-info-section p,
.houston-info-page .houston-info-section li,
.houston-info-page .houston-info-section td,
.houston-info-page .houston-info-address {
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.65;
}

.houston-info-page .houston-info-section .houston-info-lead {
    font-size: 1.0625rem;
    font-weight: 500;
    line-height: 1.55;
}

.houston-info-page .houston-info-section .houston-info-detail {
    font-weight: 400;
}

.houston-info-page .houston-info-section strong,
.houston-info-page .houston-info-address strong,
.houston-info-page .houston-info-hours-table td:last-child {
    font-weight: 600;
}

.houston-info-page .houston-info-toc a {
    font-weight: 500;
}

.houston-groups-main,
.houston-party-main,
.houston-field-main {
    padding-bottom: 58px;
}

.houston-groups-hero {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 320px;
    text-align: center;
}

.houston-events-page .houston-groups-hero h1,
.houston-events-page .houston-groups-hero p:not(.houston-events-eyebrow) {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.houston-groups-hero .houston-events-eyebrow {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
}

.houston-groups-options {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 34px;
}

.houston-group-card {
    background: var(--houston-card);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-height: 290px;
    padding: 28px;
    text-align: center;
}

.houston-group-card.is-featured {
    border-color: rgba(24, 185, 145, 0.62);
    box-shadow: 0 0 0 1px rgba(24, 185, 145, 0.18), 0 18px 48px rgba(0, 0, 0, 0.24);
}

.houston-group-card span {
    color: var(--houston-teal);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.houston-group-card h2,
.houston-party-section h2 {
    color: #fff8eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.72rem;
    letter-spacing: -0.025em;
    line-height: 1.1;
    margin: 0;
}

.houston-group-card p,
.houston-party-section p,
.houston-party-section li,
.houston-party-host span,
.houston-party-cta-row span {
    color: var(--houston-muted-2);
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.55;
    margin: 0;
}

.houston-group-card .houston-events-btn {
    margin-top: auto;
}

/* Field-trips prose sections: separate stacked paragraphs and keep a
   comfortable reading measure / line spacing. */
.houston-field-page .houston-party-section p {
    line-height: 1.72;
    max-width: 78ch;
}

.houston-field-page .houston-party-section p + p {
    margin-top: 16px;
}

.houston-party-hero {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 28px),
        linear-gradient(135deg, #073456 0%, #0d4a52 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
    display: grid;
    gap: 34px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 28px;
    min-height: 360px;
    overflow: hidden;
    padding: clamp(32px, 6vw, 58px);
}

.houston-field-hero {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 28px),
        linear-gradient(135deg, #073456 0%, #0d4a52 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
    margin-bottom: 28px;
    min-height: 400px;
    overflow: hidden;
    padding: clamp(32px, 6vw, 58px);
    text-align: center;
}

.houston-party-hero > :first-child {
    justify-self: center;
    min-width: 0;
    text-align: center;
}

.houston-party-hero .houston-events-eyebrow,
.houston-field-hero .houston-events-eyebrow {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
}

.houston-field-hero h1 {
    color: #fffaf0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.875rem, 8vw, 4.75rem);
    letter-spacing: -0.045em;
    line-height: 0.96;
    margin: 10px auto 18px;
    max-width: 760px;
    text-align: center;
}

.houston-field-hero p:not(.houston-events-eyebrow) {
    color: rgba(246, 241, 231, 0.72);
    font-size: clamp(1.125rem, 2.4vw, 1.45rem);
    font-weight: 650;
    margin: 0 auto 24px;
    max-width: 740px;
    text-align: center;
}

.houston-field-pillars {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 36px;
}

.houston-field-pillars article {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    padding: 22px;
    text-align: center;
}

.houston-field-pillars span {
    color: var(--houston-teal);
    display: block;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.14em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.houston-field-pillars h3 {
    color: #fff8eb;
    font-size: 1rem;
    font-weight: 950;
    margin: 0;
}

.houston-party-hero h1 {
    color: #fffaf0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.875rem, 8vw, 4.75rem);
    letter-spacing: -0.045em;
    line-height: 0.96;
    margin: 10px auto 18px;
    max-width: 760px;
    text-align: center;
}

.houston-party-hero p:not(.houston-events-eyebrow) {
    color: rgba(246, 241, 231, 0.72);
    font-size: clamp(1.125rem, 2.4vw, 1.45rem);
    font-weight: 650;
    margin: 0 auto 24px;
    max-width: 620px;
    text-align: center;
}

.houston-party-hero-mark {
    align-items: center;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    color: var(--houston-teal);
    display: flex;
    font-size: 1.05rem;
    font-weight: 950;
    height: 172px;
    justify-content: center;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    width: 172px;
}

.houston-party-section,
.houston-party-host {
    background: var(--houston-card);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
    margin-bottom: 22px;
    padding: 30px 34px;
}

.houston-party-section h2 {
    margin-bottom: 14px;
}

.houston-party-options,
.houston-party-addons,
.houston-field-pricing {
    display: grid;
    gap: 16px;
    margin-top: 18px;
}

.houston-party-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.houston-party-addons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.houston-field-pricing {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.houston-party-option,
.houston-party-addon,
.houston-field-price-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 22px 24px;
}

.houston-field-price-card.is-featured {
    border-color: rgba(24, 185, 145, 0.46);
}

.houston-party-option span {
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.12em;
    margin-bottom: 12px;
    padding: 4px 12px;
    text-transform: uppercase;
}

.houston-party-option .is-free {
    background: rgba(24, 185, 145, 0.15);
    color: var(--houston-teal);
}

.houston-party-option .is-paid {
    background: rgba(232, 96, 44, 0.16);
    color: var(--houston-coral);
}

.houston-party-option h3,
.houston-party-addon h3,
.houston-field-price-card h3 {
    color: #fff8eb;
    font-size: 1.08rem;
    font-weight: 950;
    margin: 0 0 8px;
}

.houston-field-price-card > span {
    background: rgba(24, 185, 145, 0.12);
    border-radius: 999px;
    color: var(--houston-teal);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 900;
    margin: 10px 0 12px;
    padding: 4px 12px;
}

.houston-party-fineprint {
    color: var(--houston-muted);
    font-size: 0.86rem !important;
    margin-top: 14px !important;
}

.houston-party-host {
    align-items: center;
    background: linear-gradient(120deg, rgba(58, 31, 18, 0.9), rgba(74, 36, 16, 0.9));
    border-color: rgba(232, 96, 44, 0.28);
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
}

.houston-party-host strong {
    color: #ffffff;
    font-size: 1.15rem;
}

.houston-party-addon {
    text-align: center;
}

.houston-party-addon h3 {
    color: var(--houston-teal);
    font-size: 0.88rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.houston-party-price {
    color: #ffffff;
    font-size: 2rem;
    font-weight: 950;
    line-height: 1;
    margin-bottom: 8px;
}

.houston-party-section ul {
    display: grid;
    gap: 8px;
    margin: 14px 0 0;
    padding-left: 20px;
}

.houston-party-section strong {
    color: #fff8eb;
}

.houston-field-checklist {
    list-style: none;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.houston-field-checklist li {
    padding-left: 32px;
    position: relative;
}

.houston-field-checklist li::before {
    align-items: center;
    background: rgba(24, 185, 145, 0.15);
    border-radius: 50%;
    color: var(--houston-teal);
    content: "\2713";
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 950;
    height: 22px;
    justify-content: center;
    left: 0;
    line-height: 1;
    position: absolute;
    top: 2px;
    width: 22px;
}

.houston-field-banner {
    align-items: center;
    background: linear-gradient(135deg, #073456 0%, #0d4a52 100%);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 22px;
    padding: 30px 34px;
}

.houston-field-banner p {
    color: rgba(246, 241, 231, 0.76);
    font-size: 1.1rem;
    font-weight: 680;
    margin: 0;
    max-width: 640px;
}

.houston-field-booking-shell {
    margin-bottom: 48px;
    margin-top: 0;
}

.houston-field-booking-shell .houston-group-checkout-form {
    scroll-margin-top: 100px;
}

.houston-field-booking-shell .houston-group-form-section {
    align-items: start;
    grid-template-columns: minmax(190px, 0.58fr) minmax(360px, 1fr);
}

.houston-field-notes-field {
    display: grid;
    gap: 8px;
    grid-column: 1 / -1;
    min-width: 0;
}

.houston-field-notes-field span {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.houston-field-notes-field textarea {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    box-sizing: border-box;
    color: #fff8eb;
    font: inherit;
    line-height: 1.45;
    min-height: 96px;
    min-width: 0;
    padding: 14px 16px;
    resize: vertical;
    width: 100%;
}

.houston-birthday-booking-shell {
    margin-top: 0;
}

.houston-birthday-booking-shell .houston-group-form-section {
    align-items: start;
    grid-template-columns: minmax(190px, 0.58fr) minmax(360px, 1fr);
}

.houston-birthday-check-field {
    align-items: center;
    background: rgba(24, 185, 145, 0.08);
    border: 1px solid rgba(24, 185, 145, 0.3);
    border-radius: 10px;
    cursor: pointer;
    display: grid !important;
    gap: 10px !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 48px;
    padding: 10px 12px;
}

.houston-birthday-check-field input {
    accent-color: var(--houston-teal);
    height: 18px;
    min-height: 18px;
    padding: 0;
    width: 18px;
}

.houston-birthday-check-field small {
    color: #fff8eb;
    font-size: 0.9rem;
    font-weight: 900;
}

.houston-private-timing {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.houston-private-timing-card {
    align-items: center;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    cursor: pointer;
    display: grid;
    gap: 14px;
    grid-template-columns: auto minmax(0, 1fr);
    min-width: 0;
    padding: 14px;
}

.houston-private-timing-card:has(input:checked) {
    background: rgba(24, 185, 145, 0.1);
    border-color: rgba(24, 185, 145, 0.42);
}

.houston-private-timing-card input {
    accent-color: var(--houston-teal);
    height: 20px;
    width: 20px;
}

.houston-private-timing-card strong {
    color: #fff8eb;
    display: block;
    font-size: 1rem;
    font-weight: 950;
}

.houston-private-timing-card small {
    color: rgba(246, 241, 231, 0.72);
    display: block;
    font-size: 0.9rem;
    font-weight: 680;
    line-height: 1.35;
    margin-top: 4px;
}

.houston-birthday-admission-options {
    display: grid;
    gap: 12px;
}

.houston-birthday-admission-card,
.houston-birthday-ticket-quantity {
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    min-width: 0;
}

.houston-birthday-admission-card {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: 14px;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 14px;
}

.houston-birthday-admission-card:has(input:checked) {
    background: rgba(24, 185, 145, 0.1);
    border-color: rgba(24, 185, 145, 0.42);
}

.houston-birthday-admission-card input {
    accent-color: var(--houston-teal);
    height: 20px;
    width: 20px;
}

.houston-birthday-ticket-quantity {
    display: grid;
    gap: 8px;
    padding: 14px;
}

.houston-birthday-ticket-quantity[hidden] {
    display: none !important;
}

.houston-birthday-admission-card strong {
    color: #fff8eb;
    display: block;
    font-size: 1rem;
    font-weight: 950;
}

.houston-birthday-admission-card small {
    color: rgba(246, 241, 231, 0.72);
    display: block;
    font-size: 0.9rem;
    font-weight: 680;
    line-height: 1.35;
    margin-top: 4px;
}

.houston-birthday-ticket-quantity span {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.houston-birthday-ticket-quantity input {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    box-sizing: border-box;
    color: #fff8eb;
    font: inherit;
    font-weight: 760;
    min-height: 48px;
    min-width: 0;
    padding: 10px 12px;
    width: 100%;
}

.houston-birthday-notes-field {
    display: grid;
    gap: 8px;
    grid-column: 1 / -1;
    min-width: 0;
}

.houston-birthday-notes-field span {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.houston-birthday-notes-field textarea {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    box-sizing: border-box;
    color: #fff8eb;
    font: inherit;
    line-height: 1.45;
    min-height: 96px;
    min-width: 0;
    padding: 14px 16px;
    resize: vertical;
    width: 100%;
}

.houston-party-cta-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 22px;
}

.houston-group-admission-main {
    padding-bottom: 58px;
}

.houston-group-admission-hero {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
}

.houston-group-admission-price {
    align-items: center;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 16px;
    color: #fff8eb;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 190px;
    padding: 24px;
    text-align: center;
}

.houston-group-admission-price span,
.houston-group-admission-price small {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.houston-group-admission-price strong {
    color: var(--houston-teal);
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 950;
    line-height: 1;
    margin: 10px 0 8px;
}

.houston-group-checkout-shell {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
}

.houston-group-checkout-form,
.houston-group-summary {
    background: var(--houston-card);
    border: 1px solid var(--houston-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
    padding: 30px 34px;
}

.houston-group-message {
    margin-bottom: 18px;
}

.houston-group-form-section {
    align-items: center;
    border-bottom: 1px solid var(--houston-line);
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
    padding: 0 0 26px;
}

.houston-group-form-section + .houston-group-form-section {
    padding-top: 26px;
}

.houston-group-form-section h2,
.houston-group-summary h2 {
    color: #fff8eb;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.72rem;
    letter-spacing: -0.025em;
    line-height: 1.1;
    margin: 0 0 10px;
}

.houston-group-form-section p,
.houston-group-summary p {
    color: var(--houston-muted-2);
    font-size: 1rem;
    font-weight: 620;
    line-height: 1.55;
    margin: 0;
}

.houston-group-qty {
    align-items: center;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--houston-line);
    border-radius: 12px;
    display: grid;
    grid-template-columns: 48px 1fr 48px;
    min-height: 64px;
    overflow: hidden;
}

.houston-group-qty .quantity-btn {
    background: rgba(255, 255, 255, 0.06);
    border: 0;
    color: #fff8eb;
    font-size: 1.6rem;
    font-weight: 900;
    height: 64px;
}

.houston-group-qty .quantity-btn:disabled {
    color: rgba(246, 241, 231, 0.28);
    cursor: not-allowed;
}

.houston-group-qty .quantity-display {
    color: var(--houston-teal);
    font-size: 2rem;
    font-weight: 950;
    text-align: center;
}

.houston-group-field-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.houston-group-field-grid label {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.houston-group-field-grid span {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.houston-group-field-grid input,
.houston-group-field-grid select {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    box-sizing: border-box;
    color: #fff8eb;
    font: inherit;
    min-width: 0;
    width: 100%;
    font-weight: 760;
    min-height: 48px;
    padding: 10px 12px;
}

.houston-group-field-grid select:disabled {
    color: rgba(246, 241, 231, 0.48);
}

.houston-group-field-grid option {
    background: #1d1d1a;
    color: #fff8eb;
}

/* Inline rule/helper text under a single field (e.g. chaperone ratio). */
.houston-group-field-grid small {
    color: rgba(246, 241, 231, 0.58);
    font-size: 0.82rem;
    font-weight: 640;
    letter-spacing: 0;
    line-height: 1.4;
    text-transform: none;
}

.houston-group-guide-upsell {
    margin: 26px 0;
}

.houston-group-guide-upsell label {
    align-items: center;
    background: rgba(24, 185, 145, 0.1);
    border: 1px solid rgba(24, 185, 145, 0.42);
    border-radius: 14px;
    cursor: pointer;
    display: grid;
    gap: 16px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 18px;
}

.houston-group-guide-upsell input {
    accent-color: var(--houston-teal);
    height: 22px;
    width: 22px;
}

.houston-group-guide-upsell strong,
.houston-group-guide-upsell b {
    color: #fff8eb;
    display: block;
    font-size: 1.02rem;
    font-weight: 950;
}

.houston-group-guide-upsell small {
    color: rgba(246, 241, 231, 0.72);
    display: block;
    font-size: 0.92rem;
    font-weight: 680;
    margin-top: 3px;
}

.houston-group-submit {
    justify-content: center;
    width: 100%;
}

.houston-group-submit:disabled {
    opacity: 0.62;
}

.houston-group-intent {
    margin-top: 8px;
}

.houston-group-intent-actions {
    align-items: center;
    display: grid;
    gap: 8px;
    justify-items: center;
}

/* Checkout CTAs read better in sentence case than the site-wide caps. */
.houston-group-intent .houston-site-btn {
    letter-spacing: normal;
    text-transform: none;
}

/* Secondary "send my info instead" action — quiet, clearly subordinate to
   the dominant reserve button above it. */
.houston-group-inquire {
    background: none;
    border: 0;
    color: var(--houston-teal, #18b991);
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    min-height: 0;
    padding: 4px;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.houston-group-inquire:hover,
.houston-group-inquire:focus-visible {
    color: #2fd6a8;
}

.houston-group-inquire:disabled {
    cursor: default;
    opacity: 0.62;
}

.houston-group-summary {
    position: sticky;
    top: 104px;
}

/* Stacked date + arrival-time picker. Lives in the left form as the
   dedicated "Date & time" step; the right rail stays a pure summary. */
.houston-group-when {
    display: grid;
    gap: 14px;
}

.houston-group-when-field {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.houston-group-when-hint {
    color: rgba(246, 241, 231, 0.6);
    font-size: 0.84rem;
    font-weight: 680;
    line-height: 1.4;
    margin: 2px 0 0;
}

.houston-group-when-field > span {
    color: rgba(246, 241, 231, 0.72);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.houston-group-when-field select {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 10px;
    box-sizing: border-box;
    color: #fff8eb;
    font: inherit;
    font-weight: 760;
    min-height: 48px;
    padding: 10px 12px;
    width: 100%;
}

.houston-group-when-field select:disabled {
    color: rgba(246, 241, 231, 0.48);
}

.houston-group-when-field option {
    background: #1d1d1a;
    color: #fff8eb;
}

/* The calendar fills the panel width cleanly. */
.houston-group-when .houston-calendar {
    width: 100%;
}

.houston-group-summary-row,
.houston-group-summary-total {
    align-items: center;
    border-bottom: 1px solid var(--houston-line);
    color: rgba(246, 241, 231, 0.78);
    display: flex;
    font-size: 1rem;
    font-weight: 760;
    justify-content: space-between;
    padding: 15px 0;
}

.houston-group-summary-row strong,
.houston-group-summary-total strong {
    color: #fff8eb;
    font-weight: 950;
}

/* Muted "15 × $8.95" beneath a summary line label. */
.houston-group-summary-qty {
    color: rgba(246, 241, 231, 0.5);
    display: block;
    font-size: 0.82rem;
    font-weight: 640;
    margin-top: 3px;
}

.houston-group-summary-row[hidden] {
    display: none;
}

.houston-group-summary-total {
    border-bottom: 0;
    color: #fff8eb;
    font-size: 1.18rem;
    margin-bottom: 12px;
}

@media (max-width: 80em) and (min-width: 61.26em) {
    .houston-events-grid.is-trio {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 61.25em) {
    .houston-events-grid,
    .houston-events-grid.is-special,
    .houston-events-grid.is-trio,
    .houston-events-side-stack.is-fullrow,
    .houston-info-hours-grid,
    .houston-groups-options,
    .houston-party-options,
    .houston-party-addons,
    .houston-field-pricing,
    .houston-field-pillars,
    .houston-party-hero,
    .houston-group-admission-hero,
    .houston-group-checkout-shell,
    .houston-group-form-section,
    .houston-birthday-booking-shell .houston-group-form-section {
        grid-template-columns: 1fr;
    }

    .houston-party-hero-mark {
        display: none;
    }

    .houston-group-summary {
        position: static;
    }

    .houston-birthday-admission-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .houston-birthday-admission-card .houston-site-btn {
        grid-column: 1 / -1;
        justify-content: center;
    }
}

@media (max-width: 48em) {
    .houston-site-nav {
        gap: 10px;
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .houston-site-logo {
        grid-column: 1;
        justify-self: center;
        margin: 0;
        transform: none;
        width: 80%;
    }

    .houston-site-logo .houston-site-logo-image {
        width: 100%;
    }

    .houston-site-logo-main {
        font-size: clamp(2.45rem, 10.8vw, 3.9rem);
        justify-content: center;
        width: 100%;
    }

    .houston-site-logo-sub {
        font-size: clamp(0.86rem, 3.35vw, 1.24rem);
    }

    .houston-site-menu-toggle {
        background:
            linear-gradient(var(--houston-teal), var(--houston-teal)) left top / 34px 4px no-repeat,
            linear-gradient(var(--houston-teal), var(--houston-teal)) left center / 34px 4px no-repeat,
            linear-gradient(var(--houston-teal), var(--houston-teal)) left bottom / 34px 4px no-repeat;
        grid-column: 1;
        grid-row: 1;
        display: block;
        justify-self: start;
        left: 18px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;
    }

    .houston-site-nav.is-menu-open {
        padding-bottom: 0;
    }

    .houston-site-nav.is-menu-open .houston-site-menu-toggle {
        top: clamp(56px, 11.5vw, 68px);
    }

    .houston-site-nav.is-menu-open .houston-site-menu {
        background: #1d1d1a;
        border-top: 1px solid var(--houston-line);
        border-top-color: var(--houston-line);
        box-shadow: 0 18px 34px rgba(0, 0, 0, 0.3);
        display: grid;
        gap: 8px;
        grid-column: 1;
        grid-row: 2;
        grid-template-columns: 1fr;
        justify-items: stretch;
        margin: 18px -18px 0;
        padding: 14px 18px 18px;
    }

    .houston-site-nav.is-menu-open .houston-site-menu > a,
    .houston-site-nav.is-menu-open .houston-site-menu-item > a {
        border-radius: 7px;
        color: var(--houston-muted-2);
        display: flex;
        font-size: 0.86rem;
        justify-content: center;
        letter-spacing: 0.04em;
        min-height: 46px;
        padding: 0 14px;
        text-align: center;
        width: 100%;
    }

    .houston-site-nav.is-menu-open .houston-site-menu > a.is-active,
    .houston-site-nav.is-menu-open .houston-site-menu > a:hover,
    .houston-site-nav.is-menu-open .houston-site-menu > a:focus-visible,
    .houston-site-nav.is-menu-open .houston-site-menu-item > a.is-active,
    .houston-site-nav.is-menu-open .houston-site-menu-item > a:hover,
    .houston-site-nav.is-menu-open .houston-site-menu-item > a:focus-visible {
        background: rgba(24, 185, 145, 0.14);
        color: #ffffff;
    }

    .houston-site-nav.is-menu-open .houston-site-menu a::after {
        content: none;
        display: none;
    }

    .houston-site-nav.is-menu-open .houston-site-menu-dropdown {
        background: rgba(24, 185, 145, 0.08);
    }


    .houston-site-hero::after {
        background: var(--houston-bg);
    }

    .houston-events-main {
        padding: 16px 16px 34px;
    }

    .houston-info-toc {
        position: static;
    }

    .houston-info-section {
        padding: 24px 20px;
        scroll-margin-top: 96px;
    }

    .houston-group-card,
    .houston-party-section,
    .houston-party-host,
    .houston-field-banner,
    .houston-group-checkout-form,
    .houston-group-summary {
        padding: 24px 20px;
    }

    .houston-group-field-grid {
        grid-template-columns: 1fr;
    }

    .houston-events-page .houston-events-hero {
        border-radius: 18px;
        min-height: 330px;
        padding: 32px 28px;
    }

    .houston-events-open-pill {
        margin-top: 28px;
    }

    .houston-event-experience-card {
        grid-template-rows: 210px 1fr;
    }

    .houston-events-card-body {
        padding: 22px;
    }

    .houston-events-stats,
    .houston-events-price-row,
    .houston-events-card-actions,
    .houston-events-cta-band {
        grid-template-columns: 1fr;
    }

    .houston-events-cta-band {
        padding: 28px;
    }

    .houston-events-page .houston-events-trust-strip {
        grid-template-columns: repeat(2, 1fr);
    }

    .houston-events-trust-item:nth-child(2) {
        border-right: 0;
    }

    .houston-events-trust-item:nth-child(-n + 2) {
        border-bottom: 1px solid var(--houston-line);
    }
}

@media (max-width: 32.5em) {
    .houston-site-nav {
        padding-left: 16px;
        padding-right: 16px;
    }

    .houston-site-menu-toggle {
        background:
            linear-gradient(var(--houston-teal), var(--houston-teal)) left top / 30px 3px no-repeat,
            linear-gradient(var(--houston-teal), var(--houston-teal)) left center / 30px 3px no-repeat,
            linear-gradient(var(--houston-teal), var(--houston-teal)) left bottom / 30px 3px no-repeat;
        left: 16px;
    }

    .houston-site-nav.is-menu-open .houston-site-menu {
        margin-left: -16px;
        margin-right: -16px;
        padding-left: 16px;
        padding-right: 16px;
    }

    .houston-events-page .houston-events-hero {
        padding: 28px 22px;
    }

    .houston-events-eyebrow {
        font-size: 0.72rem !important;
        letter-spacing: 0.11em;
    }

    .houston-events-page .houston-events-hero h1 {
        font-size: 2.2rem;
        line-height: 1.02;
    }

    .houston-events-page .houston-events-hero p:not(.houston-events-eyebrow) {
        font-size: 0.98rem;
    }

    .houston-events-section-heading {
        font-size: 0.75rem;
    }

    .houston-event-experience-card h2 {
        font-size: 1.56rem;
    }

    .houston-events-page .houston-events-trust-strip {
        grid-template-columns: 1fr;
    }

    .houston-events-trust-item,
    .houston-events-trust-item:nth-child(2) {
        border-bottom: 1px solid var(--houston-line);
        border-right: 0;
    }

    .houston-events-trust-item:last-child {
        border-bottom: 0;
    }
}

/* =========================================================================
   Houston shared inline calendar component (.houston-calendar-*).
   Used on all Houston booking pages (event checkout, field trips, birthday
   parties, group admission). Self-contained: each color resolves a --houston-*
   variable when present but falls back to the literal Houston-teal palette so
   the calendar renders identically even where those vars are not defined.
   There is intentionally NO "today"/current-day highlight: only the selected
   day is highlighted.
   ========================================================================= */
.houston-calendar {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--houston-line, rgba(255, 255, 255, 0.13));
    border-radius: 10px;
    margin-top: 8px;
    max-width: 270px;
    padding: 10px;
}

.houston-calendar-header {
    align-items: center;
    display: grid;
    gap: 6px;
    grid-template-columns: 28px 1fr 28px;
    margin-bottom: 8px;
}

.houston-calendar-month {
    color: var(--houston-text, #f6f1e7);
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
}

.houston-calendar-nav {
    align-items: center;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid var(--houston-line, rgba(255, 255, 255, 0.13));
    border-radius: 6px;
    color: var(--houston-text, #f6f1e7);
    cursor: pointer;
    display: inline-flex;
    font-size: 1.05rem;
    font-weight: 800;
    height: 28px;
    justify-content: center;
    line-height: 1;
    width: 28px;
}

.houston-calendar-nav:hover:not(:disabled) {
    background: rgba(24, 185, 145, 0.2);
    border-color: var(--houston-teal, #18b991);
}

.houston-calendar-nav:disabled {
    cursor: not-allowed;
    opacity: 0.38;
}

.houston-calendar-weekdays,
.houston-calendar-grid {
    display: grid;
    gap: 3px;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.houston-calendar-weekdays {
    color: var(--houston-muted, #aaa69d);
    font-size: 0.58rem;
    font-weight: 800;
    margin-bottom: 4px;
    text-align: center;
    text-transform: uppercase;
}

.houston-calendar-empty {
    min-height: 28px;
}

.houston-calendar-day {
    align-items: center;
    aspect-ratio: 1;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--houston-line, rgba(255, 255, 255, 0.13));
    border-radius: 6px;
    color: var(--houston-text, #f6f1e7);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    justify-content: center;
    min-height: 28px;
    min-width: 0;
}

/* Only selectable days get the teal hover/focus cue — disabled days must
   not look clickable. */
.houston-calendar-day:hover:not(:disabled),
.houston-calendar-day:focus-visible:not(:disabled) {
    border-color: var(--houston-teal, #18b991);
    outline: none;
}

.houston-calendar-day.is-selected {
    background: var(--houston-teal, #18b991);
    border-color: var(--houston-teal, #18b991);
    color: #08231c;
}

/* Unavailable (past) days: flat, borderless, struck through — clearly inert. */
.houston-calendar-day.is-disabled,
.houston-calendar-day:disabled {
    background: transparent;
    border-color: transparent;
    color: rgba(246, 241, 231, 0.26);
    cursor: not-allowed;
    text-decoration: line-through;
}

/* Dates blocked only by the minimum-lead-time rule keep a help cursor so the
   explanatory title tooltip reads as informational rather than an error. */
.houston-calendar-day.is-lead-blocked {
    cursor: help;
}

/* ==========================================================================
   Austin desktop navbar: logo position shared across EVERY Austin page.

   The landing page centres its logo over the hero headline ("An Interactive
   Adventure Like No Other!"). The other Austin pages (events, groups, park
   info, checkout, …) have no such headline, but the user must see the logo in
   the SAME place on all of them so it never jumps when navigating. So instead
   of measuring the headline per-page in JS, we bake that position in as a fixed
   offset applied to every Austin page (scoped to .austin-theme).

   The offset was measured from the landing's headline-centred logo: its centre
   sits ≈262px from the page edge. The logo is left-anchored (justify-self:
   start) and pushed right with margin-left so logoCentre = gutter + 91 (half
   the 182px mark) + margin ≈ 262. The two desktop regimes use different gutters
   so each gets its own margin, both landing on ≈262 (no jump at the boundary):
     • wide (>= 1100px): 64px gutter  → margin-left 107  (64 + 91 + 107 = 262)
     • band (768–1100px): 28px gutter → margin-left 143  (28 + 91 + 143 = 262)
   If the logo image's width (182px) or the hero gutters change, re-measure and
   update these. Mobile (<= 768px, hamburger) centres the logo on its own and is
   left untouched, so it is already identical across pages.
   ========================================================================== */
@media (min-width: 48.0625em) {
    .houston-site-body.austin-theme .houston-site-logo {
        justify-self: start;
        align-self: center;
        width: fit-content;
        margin: 0 0 0 107px;   /* wide gutter 64 → centre ≈ 262 */
    }
}

@media (min-width: 48.0625em) and (max-width: 68.75em) {
    .houston-site-body.austin-theme .houston-site-nav {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto;
        gap: 14px;
        padding-left: 28px;
        padding-right: 28px;
    }

    .houston-site-body.austin-theme .houston-site-logo {
        margin-left: 143px;   /* band gutter 28 → centre ≈ 262 (matches wide) */
    }

    .houston-site-body.austin-theme .houston-site-menu {
        grid-column: 2;
        grid-row: 1;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 6px 14px;
        height: 100%;
    }

    .houston-site-body.austin-theme .houston-site-menu a {
        font-size: 0.74rem;
        padding: 0 4px;
    }

    .houston-site-body.austin-theme .houston-site-hours,
    .houston-site-body.austin-theme .houston-site-nav-ticket-cta {
        display: none;
    }
}

/* =========================================================================
   Houston landing — mobile design pass (phones, <= 48em).
   Appended last so it wins the cascade over the earlier light/dark rules.
   This is a full polish, not just layout: glassy hero price strip with
   coloured check bullets, premium gradient ticket cards with a teal-glow
   featured state, an editorial exhibit gallery with labels set over the
   image, accent bars under section headings, and a framed map — all tuned
   to the warm-dark / teal-coral palette. Mobile-only; desktop untouched.
   ========================================================================= */
@media (max-width: 48em) {
    /* ---- Hero ---------------------------------------------------------- */
    .houston-site-hero {
        padding-top: 90px;
        padding-bottom: 80px;
    }

    .houston-site-hero h1 {
        letter-spacing: -0.012em;
        text-shadow: 0 2px 20px rgba(0, 0, 0, 0.42);
    }

    .houston-site-hero p {
        color: rgba(246, 241, 231, 0.92);
        text-shadow: 0 1px 12px rgba(0, 0, 0, 0.38);
    }

    /* Price strip → glassy card; bullets become filled coloured checks. */
    .houston-site-price-strip {
        background: linear-gradient(165deg, rgba(13, 30, 47, 0.94), rgba(8, 18, 30, 0.88));
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 16px;
        box-shadow: 0 22px 52px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.07);
        max-width: 320px;
        padding: 4px 20px;
    }

    .houston-site-price-strip div {
        gap: 1px 14px;
        padding: 12px 0;
    }

    .houston-site-price-strip div::before {
        background: var(--houston-teal)
            url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='3.6'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%2013l4%204L19%207'/%3E%3C/svg%3E")
            center / 17px 17px no-repeat;
        border: 0;
        box-shadow: 0 0 0 4px rgba(24, 185, 145, 0.16);
        height: 30px;
        width: 30px;
    }

    .houston-site-price-strip div:nth-child(2)::before {
        background-color: var(--houston-coral);
        box-shadow: 0 0 0 4px rgba(216, 90, 48, 0.18);
    }

    .houston-site-price-strip div + div {
        border-top-color: rgba(255, 255, 255, 0.12);
    }

    /* ---- Section headings: shared accent bar for a consistent rhythm --- */
    .houston-ticket-intro h2,
    .houston-exhibit-panel h2,
    .houston-visit-info h2 {
        font-size: 1.55rem;
        letter-spacing: 0.01em;
    }

    .houston-ticket-intro h2::after,
    .houston-exhibit-panel h2::after,
    .houston-visit-info h2::after {
        background: linear-gradient(90deg, var(--houston-teal), var(--houston-coral));
        border-radius: 999px;
        content: "";
        display: block;
        height: 4px;
        margin-top: 12px;
        width: 48px;
    }

    /* ---- Ticket band --------------------------------------------------- */
    .houston-ticket-band {
        padding-top: 32px;
        padding-bottom: 12px;
        row-gap: 20px;
    }

    .houston-ticket-intro h2 {
        margin-bottom: 16px;
    }

    .houston-ticket-intro p {
        font-size: 1rem;
        line-height: 1.5;
        margin: 14px 0 18px;
    }

    .houston-digital-badge {
        background: rgba(70, 173, 85, 0.1);
        border: 1px solid rgba(70, 173, 85, 0.32);
        border-radius: 999px;
        gap: 12px;
        max-width: 100%;
        padding: 8px 16px 8px 8px;
        width: fit-content;
    }

    .houston-digital-badge span {
        height: 36px;
        width: 36px;
    }

    /* Premium card surface; content hugs without a hollow lower half. */
    .houston-ticket-card {
        background: linear-gradient(168deg, #313229 0%, #272824 100%);
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 18px;
        box-shadow: 0 16px 38px rgba(0, 0, 0, 0.3);
        min-height: 0;
        overflow: visible;
        padding: 28px 24px 26px;
    }

    .houston-ticket-card h3 {
        font-size: 1.05rem;
        letter-spacing: 0.05em;
        margin-bottom: 10px;
    }

    .houston-ticket-price {
        font-size: 2.5rem !important;
        letter-spacing: -0.01em;
        margin-bottom: 12px !important;
    }

    .houston-ticket-card p {
        font-size: 0.95rem;
        line-height: 1.4;
        max-width: 320px;
    }

    .houston-ticket-card .houston-site-btn {
        border-radius: 12px;
        font-size: 1.02rem;
        height: 56px;
        letter-spacing: 0.04em;
        margin-top: 20px;
        max-width: 320px;
        min-height: 56px;
    }

    .houston-ticket-card-featured {
        border-color: rgba(70, 173, 85, 0.5);
        box-shadow:
            0 0 0 1px rgba(70, 173, 85, 0.28),
            0 18px 46px rgba(0, 0, 0, 0.34),
            0 0 56px rgba(70, 173, 85, 0.1);
        padding-top: 32px;
    }

    .houston-ticket-ribbon {
        border-radius: 999px;
        box-shadow: 0 6px 16px rgba(70, 173, 85, 0.32);
        font-size: 0.7rem;
        letter-spacing: 0.06em;
        padding: 8px 18px;
        top: -12px;
    }

    /* Drop the flag-notch triangles — they fragment against the rounded pill. */
    .houston-ticket-ribbon::before,
    .houston-ticket-ribbon::after {
        content: none;
    }

    /* ---- Exhibits: editorial gallery, labels set over the image -------- */
    .houston-exhibit-panel {
        margin-top: 6px;
    }

    .houston-exhibit-panel h2 {
        margin-bottom: 16px;
    }

    .houston-exhibit-grid {
        gap: 12px;
        grid-template-columns: 1fr 1fr;
    }

    .houston-exhibit-card {
        border: 0;
        border-radius: 16px;
        box-shadow: 0 14px 30px rgba(0, 0, 0, 0.32);
        position: relative;
    }

    .houston-exhibit-card img {
        aspect-ratio: 1 / 1;
    }

    .houston-exhibit-card h3 {
        align-items: flex-end;
        background: linear-gradient(to top, rgba(7, 13, 21, 0.9) 0%, rgba(7, 13, 21, 0.36) 52%, transparent 100%);
        bottom: 0;
        color: #ffffff;
        font-size: 0.82rem;
        justify-content: flex-start;
        left: 0;
        letter-spacing: 0.04em;
        min-height: 0;
        padding: 26px 14px 12px;
        position: absolute;
        right: 0;
        text-align: left;
        text-shadow: 0 1px 10px rgba(0, 0, 0, 0.55);
    }

    /* ---- Visit band & map --------------------------------------------- */
    .houston-visit-band {
        gap: 24px;
        padding-top: 26px;
        padding-bottom: 28px;
    }

    .houston-visit-info h2 {
        margin-bottom: 16px;
    }

    .houston-map-link {
        border: 1px solid var(--houston-line);
        border-radius: 16px;
        box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28);
    }

    .houston-map-link img {
        min-height: 160px;
    }
}

/* ------------------------------------------------------------------ */
/* Post-checkout confirmation page (houston_event_success.html)        */
/* ------------------------------------------------------------------ */
.houston-success-hero {
    min-height: 0 !important;
}

/* Dynamic status panel (filled by houston_event_success.js). */
.houston-success-status {
    background: linear-gradient(150deg, rgba(24, 185, 145, 0.12), rgba(255, 255, 255, 0.04));
    border: 1px solid rgba(24, 185, 145, 0.32);
    border-radius: 18px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
    color: var(--houston-text);
    margin-top: 18px;
    padding: clamp(24px, 4vw, 38px);
}

.houston-success-status p {
    margin: 0;
}

.houston-success-msg {
    color: var(--houston-muted-2);
    font-size: 1.1rem;
    font-weight: 650;
}

.houston-success-msg.is-pending::before {
    background: var(--houston-amber);
    border-radius: 50%;
    content: "";
    display: inline-block;
    height: 10px;
    margin-right: 10px;
    vertical-align: middle;
    width: 10px;
    animation: houston-success-pulse 1.2s ease-in-out infinite;
}

.houston-success-msg.is-error {
    color: #ffb4a0;
    font-weight: 700;
}

@keyframes houston-success-pulse {
    0%, 100% { opacity: 0.35; }
    50% { opacity: 1; }
}

/* Confirmed / request-received result block. */
.houston-success-result {
    display: grid;
    gap: 12px;
    justify-items: start;
}

.houston-success-check {
    align-items: center;
    background: var(--houston-teal);
    border-radius: 50%;
    box-shadow: 0 0 0 8px rgba(24, 185, 145, 0.14);
    display: inline-flex;
    height: 52px;
    justify-content: center;
    width: 52px;
}

.houston-success-check::after {
    border: solid #07241c;
    border-width: 0 4px 4px 0;
    content: "";
    height: 22px;
    margin-top: -6px;
    transform: rotate(45deg);
    width: 11px;
}

.houston-success-headline {
    color: #fffaf0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.75rem, 4vw, 2.25rem);
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1.05;
}

.houston-success-body {
    color: var(--houston-muted-2);
    font-size: 1.12rem;
    font-weight: 600;
    line-height: 1.55;
    max-width: 620px;
}

.houston-success-body strong {
    color: var(--houston-text);
    font-weight: 800;
}

.houston-success-note {
    color: var(--houston-muted);
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.5;
    max-width: 620px;
}

/* Plan-your-visit helper cards. */
.houston-success-cards {
    display: grid;
    gap: 22px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.houston-success-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.houston-success-card p {
    color: var(--houston-muted-2);
    font-size: 1.04rem;
    font-weight: 600;
    line-height: 1.55;
    margin: 0;
}

.houston-success-card .houston-events-btn {
    margin-top: auto;
}

.houston-success-address {
    color: var(--houston-text) !important;
    font-weight: 750 !important;
}

.houston-success-phone {
    color: var(--houston-teal);
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: -0.01em;
    text-decoration: none;
}

.houston-success-phone:hover,
.houston-success-phone:focus-visible {
    text-decoration: underline;
}

.houston-success-help-note {
    color: var(--houston-muted) !important;
    font-size: 0.95rem !important;
}

@media (max-width: 60em) {
    .houston-success-cards {
        grid-template-columns: 1fr;
    }
}

/* ====================================================================
   Visit band — "Find Us" redesign (shared across all venue landings).
   Four balanced columns on desktop: intro · contact · hours · map.
   Auto-themes through the existing accent (--houston-teal) and the
   primary CTA tokens, so Austin/Houston/San Antonio each pick up their
   own colors with no per-venue CSS. Opt in with .is-redesigned so the
   higher-specificity rules win over the original light + dark skins.
   ==================================================================== */
.houston-visit-band.is-redesigned {
    align-items: stretch;
    border-top: 1px solid var(--houston-line);
    column-gap: 44px;
    grid-template-columns: 1.25fr 1fr 0.9fr 1.7fr;
    padding: 46px 64px 52px;
    row-gap: 34px;
}

.houston-visit-band.is-redesigned .houston-visit-intro {
    align-self: start;
}

.houston-visit-eyebrow {
    color: var(--houston-teal);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.houston-visit-band.is-redesigned .houston-visit-intro h2 {
    color: var(--houston-text);
    font-size: 1.6rem;
    line-height: 1.18;
    margin: 0 0 12px;
}

.houston-visit-lede {
    color: var(--houston-muted);
    font-size: 0.95rem;
    line-height: 1.55;
    margin: 0;
    max-width: 26ch;
}

/* Small uppercase label that heads each detail group. */
.houston-visit-band.is-redesigned .houston-visit-label {
    color: var(--houston-muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 0 0 12px;
    text-transform: uppercase;
}

.houston-visit-band.is-redesigned .houston-visit-contact {
    align-content: start;
    display: grid;
    gap: 24px;
}

.houston-visit-band.is-redesigned .houston-visit-detail {
    margin: 0;
}

.houston-visit-band.is-redesigned .houston-visit-detail p {
    color: var(--houston-text);
    font-size: 0.98rem;
}

.houston-visit-band.is-redesigned .houston-visit-detail-link {
    color: var(--houston-text);
    text-decoration: none;
    transition: color 0.15s ease;
}

.houston-visit-band.is-redesigned .houston-visit-detail-link:hover {
    color: var(--houston-teal);
}

/* Hours: borderless rows with the label/value pushed to the edges. */
.houston-visit-band.is-redesigned .houston-visit-hours {
    align-content: start;
    border-left: 0;
    display: block;
    min-height: 0;
    padding-left: 0;
}

.houston-visit-band.is-redesigned .houston-visit-hours dl {
    display: grid;
    gap: 0;
}

.houston-visit-band.is-redesigned .houston-visit-hours dl > div {
    align-items: baseline;
    border-top: 1px solid var(--houston-line);
    display: flex;
    gap: 12px;
    grid-template-columns: none;
    justify-content: space-between;
    padding: 9px 0;
}

.houston-visit-band.is-redesigned .houston-visit-hours dl > div:first-child {
    border-top: 0;
    padding-top: 0;
}

.houston-visit-band.is-redesigned .houston-visit-hours dt {
    color: var(--houston-muted);
    font-weight: 700;
}

.houston-visit-band.is-redesigned .houston-visit-hours dd {
    color: var(--houston-text);
    white-space: nowrap;
}

/* Map: fills the column height with the directions button beneath it. */
.houston-visit-band.is-redesigned .venue-map {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.houston-visit-band.is-redesigned .venue-map-canvas {
    border: 1px solid var(--houston-line);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
    flex: 1 1 auto;
    min-height: 300px;
}

/* Settle the map into the dark theme rather than glaring bright white. */
.houston-visit-band.is-redesigned .venue-map-frame {
    filter: grayscale(0.12) contrast(1.02);
}

.venue-map-tag {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    bottom: 12px;
    left: 12px;
    padding: 8px 11px;
    pointer-events: none;
    position: absolute;
}

.venue-map-tag b {
    color: #23211c;
    display: block;
    font-size: 0.82rem;
    font-weight: 700;
}

.venue-map-tag span {
    color: #6a675f;
    font-size: 0.7rem;
}

.houston-visit-band.is-redesigned .venue-map-directions {
    align-self: start;
    margin-top: 16px;
}

@media (max-width: 1080px) {
    .houston-visit-band.is-redesigned {
        column-gap: 32px;
        grid-template-columns: 1fr 1fr;
    }

    .houston-visit-band.is-redesigned .venue-map {
        grid-column: 1 / -1;
    }

    .houston-visit-band.is-redesigned .venue-map-canvas {
        min-height: 320px;
    }
}

@media (max-width: 640px) {
    .houston-visit-band.is-redesigned {
        grid-template-columns: 1fr;
        padding: 34px 22px 40px;
        row-gap: 28px;
    }

    .houston-visit-band.is-redesigned .houston-visit-lede {
        max-width: none;
    }

    .houston-visit-band.is-redesigned .venue-map-directions {
        align-self: stretch;
        text-align: center;
    }
}

/* =====================================================================
   Mobile nav bar (authoritative — placed last to win over the layered
   breakpoints above). Layout: [logo] ........ [Buy Tickets] [hamburger].
   Member is demoted into the drawer; the cramped hours block is dropped.
   ===================================================================== */
@media (max-width: 48em) {
    .houston-site-nav {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 10px;
        padding: 14px 16px;
        position: relative;
    }

    /* Bar order, left -> right: logo ........ Buy Tickets  hamburger */
    .houston-site-logo {
        order: 1;
        margin: 0 auto 0 0;   /* margin-right:auto pushes the rest to the right */
        width: auto;
        min-width: 0;
        transform: none;
    }

    .houston-site-logo .houston-site-logo-image {
        width: 100%;
        max-width: 140px;
    }

    /* Declutter: hours move out of the bar (still in the page/footer). */
    .houston-site-hours {
        display: none;
    }

    /* Buy Tickets is not shown in the bar (kept on the default mobile hide);
       Member is also demoted into the drawer. The bar is just logo + menu. */
    .houston-site-nav-member-cta {
        display: none;
    }

    .houston-site-menu-toggle {
        order: 3;
        flex: 0 0 auto;
    }

    /* Drawer pops as a full-width overlay below the bar (kept out of the
       single-line flex row so the bar items never wrap). */
    .houston-site-nav.is-menu-open .houston-site-menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: auto;
        margin: 0;
        z-index: 50;
    }

    /* Reveal the drawer-only Member sign-in row when the menu is open. */
    .houston-site-nav.is-menu-open .houston-site-menu-mobile-extra {
        display: inline-flex;
    }
}