/* Globaali: ei ikina alleviivausta millekaan linkille, riippumatta GP:n omasta Customizer-CSS:sta */
html { background: #000; }

a { text-decoration: none !important; }

/* ===== Footer: "Teatterista"-rivi (Historiikki, Hallitus, Rekrytointi, Henkilokunta) ===== */
.vt-footer-teatterista {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: #101028;
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 0.9em 1.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.4em 1.8em;
}
.vt-footer-teatterista-label {
    color: var(--accent, #EDC263);
    font-weight: 700;
    font-size: 0.8em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-right: 0.4em;
}
.vt-footer-teatterista a {
    color: #d8d8e0;
    font-size: 0.85em;
}
.vt-footer-teatterista a:hover { color: #fff; }
@media (max-width: 600px) {
    .vt-footer-teatterista { justify-content: flex-start; text-align: left; }
}

/* ===== Yhteinen mega-menu: Ravintolat ja palvelut / Tietoa lipuista /
   Yritykset ja ryhmat / Teatteripaketit - MIKA TAHANSA nailsta avaa SAMAN
   koko sivun levyisen paneelin, jossa nakyvat KAIKKI alasivut kaikista
   neljasta ryhmasta yhta aikaa (nelja saraketta). ===== */
#menu-item-167 > .sub-menu,
#menu-item-75 > .sub-menu,
#menu-item-179 > .sub-menu,
#menu-item-108 > .sub-menu,
#menu-item-282 > .sub-menu {
    display: block !important;
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    padding: 0 !important;
    background: #fff !important;
    box-sizing: border-box !important;
    box-shadow: 0 14px 32px rgba(0,0,0,0.16) !important;
}
/* Nakymaton "silta" pudotusvalikon ja liipaisimen valiin. Headerissa on
   navigaatiorivin alla oma taustavari (padding), jonka takia hiiri menettaa
   hover-tilan hetkeksi ennen kuin ehtii itse paneeliin - valikko sulkeutui
   liian aikaisin. Silta pitaa hover-tilan yalla koko matkan. */
#menu-item-167 > .sub-menu::before,
#menu-item-75 > .sub-menu::before,
#menu-item-179 > .sub-menu::before,
#menu-item-108 > .sub-menu::before,
#menu-item-282 > .sub-menu::before {
    content: "";
    position: absolute;
    top: -14px;
    left: 0;
    width: 100%;
    height: 14px;
}

.vt-mega-columns-wrap { width: 100%; list-style: none; }
.vt-mega-columns {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 2em;
    max-width: 1400px;
    margin: 0 auto;
    padding: 2.2em 4vw;
    box-sizing: border-box;
}
.vt-mega-col { min-width: 0; }
.vt-mega-col-title {
    font-size: 0.8em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 700;
    color: var(--accent, #EDC263);
    background: var(--contrast, #1A1A40);
    padding: 0.5em 0.7em;
    margin: 0 0 0.8em;
    border-radius: 3px;
}
/* TARKEAA: GP:n oma CSS kohdistaa YLEISESTI KAIKKIIN sisakkaisiin
   ul-elementteihin ".main-navigation ul ul" -saannon (position:absolute;
   opacity:0; height:0; overflow:hidden; left:-99999px;) siina uskossa etta
   jokainen ul-sisalla-ul on oma pudotusvalikkotasonsa. Meidan
   .vt-mega-col-list on rakenteellisesti kolmannen tason ul (nav > ul >
   li > ul.sub-menu > ... > ul.vt-mega-col-list), joten se peri saman
   piilotuksen - vain sarakkeiden otsikot (h3, ei ul) jaivat nakyviin.
   Nollataan kaikki tuo eksplisiittisesti !important:lla. */
.vt-mega-col-list,
.main-navigation .main-nav ul ul.vt-mega-col-list,
.main-navigation .main-nav ul ul ul.vt-mega-col-list {
    position: static !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    box-shadow: none !important;
    background: transparent !important;
    float: none !important;
    z-index: auto !important;
    transition: none !important;
    width: 100% !important;
    max-width: none !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 0.5em !important;
}
.vt-mega-col-list li,
.main-navigation .main-nav ul ul.vt-mega-col-list li,
.main-navigation .main-nav ul ul ul.vt-mega-col-list li {
    width: 100% !important;
    position: static !important;
    float: none !important;
    background: transparent !important;
}
.vt-mega-col-list li > a,
.main-navigation .main-nav ul ul.vt-mega-col-list li > a,
.main-navigation .main-nav ul ul ul.vt-mega-col-list li > a {
    white-space: normal !important;
    color: inherit !important;
    opacity: 1 !important;
    padding: 0.2em 0 !important;
}
.vt-mega-col-item {
    display: flex !important;
    align-items: center;
    gap: 0.6em;
    padding: 0.2em 0 !important;
    text-decoration: none !important;
}
.vt-mega-col-icon {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--contrast, #1A1A40);
    display: flex;
    align-items: center;
    justify-content: center;
}
.vt-mega-col-icon img { display: block; width: 14px; height: 14px; }
.vt-mega-col-item-title {
    font-size: 0.88em;
    color: var(--contrast, #1A1A40);
    line-height: 1.3;
}
.vt-mega-col-item:hover .vt-mega-col-item-title { color: var(--accent, #EDC263); }

/* Teatteripaketit-sarake: kumppanitarjoukset pienina kuva+otsikko-riveina. */
.vt-mega-col-partner {
    display: flex !important;
    align-items: center;
    gap: 0.7em;
    padding: 0.2em 0 !important;
    text-decoration: none !important;
}
.vt-mega-col-partner-img {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 3px;
    overflow: hidden;
    background: #f2f2f2;
}
.vt-mega-col-partner-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vt-mega-col-partner-title {
    font-size: 0.88em;
    font-weight: 600;
    color: var(--contrast, #1A1A40);
    line-height: 1.25;
}
.vt-mega-col-partner:hover .vt-mega-col-partner-title { color: var(--accent, #EDC263); }

@media (max-width: 1100px) {
    .vt-mega-columns { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
    #menu-item-167 > .sub-menu,
    #menu-item-174 > .sub-menu,
    #menu-item-179 > .sub-menu,
    #menu-item-108 > .sub-menu {
        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px) !important;
    }
    .vt-mega-columns { grid-template-columns: 1fr; padding: 1.4em 1.6em; gap: 1.6em; }
}

/* ===== Esitys-sivu (Terhin "Naytoskohtainen sivu" -leiska) ===== */
body.single-esitys .site-main { margin-top: 0 !important; }
body.single-esitys .inside-article { padding-top: 0 !important; }

.vt-esitys-hero-img {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    height: 70vh;
    min-height: 480px;
    max-height: 820px;
    background-size: cover;
    background-position: center;
}
.vt-esitys-hero-bar {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: var(--contrast, #1A1A40);
}
/* Napin ja otsikon (tekstilogon) yhteinen rivi, sama 1240px-container kuin muualla
   sivulla - nappi ja otsikko keskitetty samalle pystylinjalle (align-items: center). */
.vt-esitys-hero-bar-inner {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5em;
    flex-wrap: wrap;
    padding: 1.4em 50px;
    box-sizing: border-box;
}
.vt-esitys-hero-titlewrap { text-align: right; }
.vt-esitys-hero-title { color: var(--accent, #EDC263); font-weight: 800; font-size: 2em; margin: 0; line-height: 1.15; }
.vt-esitys-hero-subtitle { color: #fff; opacity: 0.9; margin: 0.2em 0 0; }

.vt-fact-row {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: #eeeeee;
    padding: 1.2em 1.5em;
    box-sizing: border-box;
}
.vt-fact-row-inner {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5em;
}
.vt-fact-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.4em; min-width: 90px; }
.vt-fact-icon { color: var(--accent, #EDC263); display: flex; align-items: center; justify-content: center; }
.vt-fact-icon img { width: 36px; height: 36px; display: block; }
.vt-fact-label { font-size: 0.72em; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; color: var(--contrast, #1A1A40); }
.vt-fact-value { font-size: 0.85em; color: var(--contrast, #1A1A40); }

/* Kompakti faktarivi ohjelmistokorteissa (archive-esitys.php): perus .vt-fact-row
   on tehty koko nayton levyiseksi hero-palkkia varten (100vw + negatiivinen margin),
   mika rikkoi kortin sisalla, koska kortilla on overflow:hidden - teksti leikkautui
   naennaisesti pois. Kompakti versio pysyy kortin omassa leveydessa. */
.vt-fact-row.vt-fact-row--compact {
    width: calc(100% + 2em);
    margin: 0.9em -1em -1em -1em;
    background: var(--contrast, #1A1A40) !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    gap: 0.3em 0.9em;
    padding: 0.7em 1em;
    box-sizing: border-box;
    list-style: none;
    min-height: 4.6em;
}
.vt-fact-row--compact li {
    font-size: 0.82em;
    color: #fff;
    list-style: none;
    line-height: 1.4;
}
.vt-fact-row--compact li:not(:last-child) {
    position: relative;
    padding-right: 0.95em;
}
.vt-fact-row--compact li:not(:last-child)::after {
    content: "•";
    position: absolute;
    right: -0.05em;
    color: var(--accent, #EDC263);
}

.vt-esitys-section { max-width: 900px; margin: 2.5em auto; padding: 0 1.5em; scroll-margin-top: 1em; }
.vt-esitys-section h2 { margin-bottom: 0.6em; }
.vt-esitys-intro { text-align: left; }
.vt-esitys-lead { font-style: italic; font-weight: 600; margin: 0 0 1em; }
.vt-esittely-teksti, .vt-content-body { line-height: 1.7; }

.vt-gold-divider { border: none; border-top: 3px solid var(--accent, #EDC263); max-width: 1240px; margin: 2.5em auto; }

.vt-esitys-naytos-row {
    display: flex;
    align-items: center;
    gap: 1.5em;
    padding: 0.8em 0;
    border-bottom: 1px solid #eee;
    flex-wrap: wrap;
}
.vt-esitys-naytos-pvm { font-weight: 700; color: var(--contrast, #1A1A40); }
.vt-esitys-naytos-status { flex: 1 1 auto; opacity: 0.75; }
.vt-esitys-naytos-btn {
    background: linear-gradient(135deg, #F4D58D 0%, var(--accent, #EDC263) 60%, #C99A3C 100%);
    color: #1A1A40 !important;
    font-weight: 700;
    padding: 0.6em 1.3em;
    border-radius: 3px;
    text-decoration: none !important;
}
.vt-cta-note { font-size: 0.85em; opacity: 0.7; margin-top: 0.8em; }

.vt-team-list { display: flex; flex-direction: column; gap: 0.5em; }
.vt-team-row { display: flex; gap: 2em; padding: 0.3em 0; }
.vt-team-label { flex: 0 0 180px; color: var(--contrast, #1A1A40); opacity: 0.75; }
.vt-team-value { font-weight: 700; color: var(--contrast, #1A1A40); }
.vt-team-row-rooleissa { margin-top: 0.8em; }

.vt-gallery { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 200px; gap: 0.75em; }
.vt-gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: 3px; display: block; }

.vt-esitys-bottom-cta { text-align: center; margin: 3em 0; }
.vt-esitys-bottom-cta .vt-hero-slide-btn { display: inline-block; }

@media (max-width: 700px) {
    .vt-esitys-hero-bar-inner { justify-content: center; text-align: center; }
    .vt-esitys-hero-titlewrap { text-align: center; }
    .vt-gallery { grid-template-columns: repeat(2, 1fr); }
    .vt-team-label { flex: 0 0 130px; }
}

/* Ajankohtainen */
/* Ajankohtainen */
.vt-kategoria-badge { margin: 0 0 0.75em; }
.vt-badge {
    display: inline-block;
    padding: 0.25em 0.75em;
    background: var(--accent, #7a1f2b);
    color: #fff;
    border-radius: 3px;
    font-size: 0.8em;
    margin-right: 0.4em;
}
.vt-ajk-meta { font-size: 0.85em; opacity: 0.65; margin: 0 0 0.5em; }
.vt-ingressi { font-size: 1.15em; font-weight: 500; margin-bottom: 1.5em; }
.vt-ajk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5em; margin: 1.5em 0; }
@media (max-width: 900px) {
    .vt-ajk-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .vt-ajk-grid { grid-template-columns: 1fr; }
}
.vt-ajk-card { display: block; text-decoration: none; color: inherit; border: 1px solid #eee; border-radius: 4px; overflow: hidden; }
.vt-ajk-card-img img { width: 100%; height: 200px; object-fit: cover; display: block; }
.vt-ajk-card-body { padding: 1em; }
.vt-ajk-card-body h2 { font-size: 1.1em; margin: 0.25em 0 0.5em; }
.vt-ajk-subtitle { font-weight: 700; text-transform: uppercase; font-size: 0.75em; letter-spacing: 0.03em; opacity: 0.7; margin: 0.35em 0 0.25em; }
.vt-ajk-excerpt { font-size: 0.92em; line-height: 1.5; margin: 0.5em 0 0.75em; opacity: 0.85; }
.vt-ajk-card-title-link { color: inherit; text-decoration: none; }
.vt-ajk-card-title-link:hover { opacity: 0.7; }
.vt-ajk-card-buttons { display: flex; gap: 0.5em; margin-top: 0.75em; flex-wrap: wrap; }
.vt-ajk-btn-primary { background: var(--accent, #7a1f2b); color: #fff; padding: 0.5em 1em; border-radius: 3px; text-decoration: none; font-size: 0.85em; display: inline-block; }
.vt-ajk-btn-primary:hover { opacity: 0.88; color: #fff !important; }
.vt-ajk-btn-secondary { border: none; background: none; padding: 0.5em 0; color: inherit; font-weight: 600; text-decoration: none; font-size: 0.85em; display: inline-block; }
.vt-ajk-btn-secondary:hover { opacity: 0.7; }

/* Etusivu */
.vt-hero { padding: 3em 1.5em; text-align: center; }
.vt-hero-inner { max-width: 780px; margin: 0 auto; }
.vt-hero-inner h1 { margin-bottom: 0.4em; }
.vt-hero-inner p { font-size: 1.15em; margin-bottom: 1.5em; opacity: 0.85; }
.vt-hero-cta { display: flex; gap: 1em; justify-content: center; flex-wrap: wrap; }
.vt-hero-cta a { display: inline-block; padding: 0.8em 1.6em; border-radius: 3px; text-decoration: none; }
.vt-hero-cta a.vt-btn-primary { background: var(--accent, #7a1f2b); color: #fff; }
.vt-hero-cta a.vt-btn-primary:hover { color: #fff !important; }
.vt-hero-cta a.vt-btn-secondary { border: 1px solid currentColor; }

.vt-home-section {
    padding: 2.5em 1.5em;
    max-width: 1240px;
    /* inside-article -elementin oma 40px reunatayte estaisi taman saavuttamasta
       koko 1240px leveytta - kumotaan se negatiivisella marginaalilla, jotta
       leveys tasmaa "Seuraavat naytokset" -osion kanssa. */
    margin-left: -40px;
    margin-right: -40px;
}
.vt-home-section h2 { margin-bottom: 1em; }
.vt-section-link { display: inline-block; margin-top: 1em; text-decoration: none; font-weight: 600; }
.vt-section-link:hover { opacity: 0.7; }

.vt-cta-strip { display: flex; gap: 1em; flex-wrap: wrap; padding: 2em 1.5em; max-width: 1240px; margin: 0 auto; background: transparent; }
.vt-cta-strip a {
    flex: 1 1 220px;
    text-align: center;
    padding: 1.2em 1.8em;
    border: none;
    border-radius: 4px;
    background: var(--contrast, #1A1A40);
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 600;
}
.vt-cta-strip a:hover { opacity: 0.85; }

.vt-partner-banner { text-align: center; padding: 3em 1.5em; max-width: 1240px; margin: 0 auto; border: 1px dashed var(--contrast-3, #b2b2be); border-radius: 6px; }
.vt-partner-banner .vt-partner-placeholder { opacity: 0.6; font-style: italic; margin-bottom: 1em; }

/* Site footer - Terhin leiskan mukainen yksi yhtenainen musta rivisto */
.vt-site-footer { background: #000; color: #fff; padding: 0 1.5em 1.5em; margin-top: 2em; }
.vt-site-footer a { text-decoration: none !important; }
/* GP:n oma globaali a:hover{color:var(--contrast)} on lahes musta - nakymaton mustalla footer-taustalla.
   Footerin linkkien hover aina aksenttikeltainen. */
.vt-site-footer a:hover,
.vt-site-footer a:focus {
    color: var(--accent, #EDC263) !important;
}

.vt-footer-grid {
    display: grid;
    grid-template-columns: auto 1.3fr 1.1fr 1fr auto;
    grid-template-areas:
        "logo heading input   button city"
        "logo address address social city";
    column-gap: 2.5em;
    row-gap: 1.2em;
    max-width: 1240px;
    margin: 0 auto;
    padding: 2.5em 0;
    border-bottom: 1px solid rgba(255,255,255,0.15);
    align-items: start;
}
.vt-fg-logo { grid-area: logo; align-self: center; }
.vt-fg-logo img { display: block; height: auto; max-width: 160px; }

.vt-fg-heading { grid-area: heading; }
.vt-fg-heading h2 { color: var(--accent, #EDC263); margin: 0 0 0.3em; font-size: 1.3em; }
.vt-fg-heading p { margin: 0; font-size: 0.88em; opacity: 0.85; line-height: 1.4; }

.vt-fg-input { grid-area: input; }
.vt-fg-input label { display: block; font-size: 0.78em; opacity: 0.75; margin-bottom: 0.4em; }
.vt-fg-input input {
    width: 100%;
    background: #f2f2f2;
    border: none;
    border-radius: 3px;
    padding: 0.75em 0.9em;
    font-size: 0.9em;
    color: #333;
}

.vt-fg-button { grid-area: button; align-self: end; }
.vt-newsletter-btn {
    width: 100%;
    background: var(--accent, #EDC263);
    color: #1A1A40;
    border: none;
    border-radius: 3px;
    padding: 0.8em 1.2em;
    font-weight: 700;
    font-size: 0.9em;
    cursor: not-allowed;
}

.vt-fg-address { grid-area: address; }
.vt-fg-address p { margin: 0 0 0.9em; font-size: 0.88em; line-height: 1.5; opacity: 0.9; }
.vt-fg-address a { color: #fff; }
.vt-fg-address a:hover { opacity: 0.7; }

.vt-fg-social { grid-area: social; }
.vt-fg-social h3 { font-size: 0.85em; text-transform: none; margin: 0 0 0.8em; opacity: 0.9; font-weight: 600; }
.vt-social-icons { display: flex; gap: 0.7em; }
.vt-social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1.5px solid var(--accent, #EDC263);
    color: var(--accent, #EDC263);
}
.vt-social-icons a:hover { background: var(--accent, #EDC263); color: #1A1A40; }

@media (max-width: 900px) {
    .vt-footer-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "logo"
            "heading"
            "input"
            "button"
            "address"
            "social"
            "city";
    }
}

.vt-footer-bottom {
    max-width: 1240px;
    margin: 1.5em auto 0;
    padding-top: 1.2em;
    font-size: 0.78em;
    opacity: 0.65;
}
.vt-footer-bottom-links { display: flex; flex-wrap: wrap; gap: 0.4em 1.4em; margin-bottom: 0.8em; }
.vt-footer-bottom-links a { color: #fff; }
.vt-footer-bottom-links a:hover { opacity: 0.7; }
.vt-footer-toimisto { opacity: 0.75; }
.vt-footer-toimisto a { color: #fff; }
.vt-footer-copy { margin: 0; }

/* Etusivun hero-slider - Terhin leiskan mukaan: kuva ilman overlaytä, sen alla navy-palkki */
.vt-hero-slider {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: var(--contrast, #1A1A40);
}
.vt-hero-slider-track { position: relative; width: 100%; }
.vt-hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s ease;
}
.vt-hero-slide.is-active { position: relative; opacity: 1; visibility: visible; }
.vt-hero-slide-image {
    width: 100%;
    height: 70vh;
    min-height: 480px;
    max-height: 820px;
    background-size: cover;
    background-position: center;
}
.vt-hero-slide-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5em;
    flex-wrap: wrap;
    padding: 1.4em 50px;
}
.vt-hero-slide-btn {
    flex: 0 0 auto;
    background: linear-gradient(135deg, #F4D58D 0%, var(--accent, #EDC263) 60%, #C99A3C 100%);
    color: #1A1A40 !important;
    font-weight: 700;
    padding: 0.85em 1.8em;
    border-radius: 3px;
    text-decoration: none !important;
}
.vt-hero-slide-titlelink {
    text-align: right;
    text-decoration: none !important;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding-right: 146px; /* jattaa 25px tilan ennen sliderin pisteita (7 pistetta) */
}
.vt-hero-slide-title {
    color: var(--accent, #EDC263);
    font-weight: 800;
    font-size: 2.2em;
    line-height: 1.1;
}
.vt-hero-slide-subtitle {
    color: #fff;
    font-size: 1em;
    opacity: 0.9;
    margin-top: 0.2em;
}
.vt-hero-slider-dots {
    position: absolute;
    bottom: 54px; /* pystykeskitys navy-palkin sisalla (palkin korkeus ~117.6px) */
    right: 50px;
    display: flex;
    gap: 0.5em;
    z-index: 2;
}
.vt-hero-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1px solid #fff;
    background: transparent;
    padding: 0;
    cursor: pointer;
}
.vt-hero-dot.is-active { background: var(--accent, #EDC263); border-color: var(--accent, #EDC263); }
@media (max-width: 600px) {
    .vt-hero-slide-image { height: 50vh; min-height: 320px; }
    .vt-hero-slide-title { font-size: 1.5em; }
    .vt-hero-slide-bar { justify-content: center; text-align: center; padding: 1.4em 1.2em; }
    .vt-hero-slide-titlelink { align-items: center; text-align: center; padding-right: 0; }
    .vt-hero-slider-dots { position: static; justify-content: center; margin: 0.8em auto 0; }
}

/* Header/menu vari ja tausta hoidetaan nyt Customizer > Colors > Primary Navigation -paneelista. */
/* Taydentavat tyylit joita Customizerin varipaneeli ei kata: */
.site-header .site-title a,
.site-header .site-description {
    color: #fff;
}
.main-navigation .menu-toggle,
.main-navigation .mobile-menu-control-wrapper .slide-toggle {
    color: #fff;
}
.main-navigation .main-nav ul li > a {
    opacity: 0.82;
}
.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current_page_item > a,
.main-navigation .main-nav ul li > a:hover {
    opacity: 1;
    font-weight: 600;
}
/* Poistaa valkoisen valin sliderin ja menun valilta (vain Etusivulla, page-id-56) */
body.page-id-56 .site-main {
    margin-top: 0 !important;
}
body.page-id-56 .inside-article {
    padding-top: 0 !important;
}

/* Ohjelmisto-arkistosivu: koko sisalto 20px alaspain */
body.post-type-archive-esitys #main {
    margin-top: 20px;
}


.vt-ilmoituspalkki { background: #000; color: #fff; text-align: center; padding: 0.7em 1em; font-weight: 600; }
.vt-ilmoituspalkki a { color: var(--accent, #EDC263); }

/* ===== Megamenu: paavalikko pysyy aina yhdella rivilla, alavalikot leveina paneeleina ===== */
@media (min-width: 769px) {
    .main-navigation .main-nav > ul {
        flex-wrap: nowrap !important;
        white-space: nowrap;
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .main-navigation .main-nav > ul::-webkit-scrollbar {
        display: none;
    }
    .main-navigation .main-nav > ul > li {
        flex: 0 0 auto !important;
    }
    .main-navigation .main-nav > ul > li > a {
        padding-left: 0.6em !important;
        padding-right: 0.6em !important;
        font-size: 0.9em !important;
    }

    /* Alavalikko = leveä megapaneeli koko naytön levyinen, ei kapea pystylista */
    /* Ankkuri on koko leveydelta ulottuva .site-header, ei kapea valikkokohde,
       jotta left:50%/translateX keskittyy oikein koko nayttoon eika vain valikkokohteen leveyteen. */
    .site-header {
        position: relative;
    }
    .main-navigation .main-nav ul li.menu-item-has-children {
        position: static !important;
    }
    .main-navigation .inside-navigation.grid-container {
        position: static !important;
    }
    .main-navigation .main-nav ul ul {
        position: absolute !important;
        left: 50% !important;
        top: 100% !important;
        transform: translateX(-50%) !important;
        width: 100vw !important;
        max-width: 100vw !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: flex-start !important;
        gap: 0.3em 2.2em !important;
        padding: 1.4em 2em !important;
        margin: 0 !important;
        background: var(--contrast, #1A1A40) !important;
        box-shadow: 0 10px 24px rgba(0,0,0,0.25);
    }
    .main-navigation .main-nav ul ul li {
        width: auto !important;
        float: none !important;
        background: transparent !important;
    }
    .main-navigation .main-nav ul ul li > a {
        white-space: nowrap;
        padding: 0.45em 0.8em !important;
        color: #fff !important;
        opacity: 0.85;
    }
    .main-navigation .main-nav ul ul li > a:hover {
        opacity: 1;
    }
}
body {
    overflow-x: hidden;
}

/* ===== Header/nav-rivi lahemmas sivun reunaa =====
   GeneratePress 3.6:ssa ei ole erillista "Header container" -kenttaa Customizerissa,
   vain yksi jaettu Container Width joka koskee myos sisaltoa (matchattu tkteatteri.fi:hin, 1240px).
   Siksi tama on rajattu vain .site-header:in sisalle CSS:lla, ei vaikuta sisaltoalueen leveyteen. */
.site-header .grid-container {
    max-width: 100% !important;
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}






/* ===== Seuraavat naytokset -osio (etusivu) ===== */
.vt-naytokset-section {
    background: #eeeeee;
    padding: 2.5em 1.5em;
    width: 100vw;
    margin-left: calc(50% - 50vw);
}
.vt-naytokset-inner {
    max-width: 1240px;
    margin: 0 auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 3em;
    flex-wrap: wrap;
}
.vt-naytokset-list { flex: 0 1 700px; max-width: 700px; padding-left: 25px; }
.vt-naytokset-list h2 { margin: 0 0 0.8em; }
.vt-naytos-row {
    display: flex;
    align-items: baseline;
    gap: 1em;
    padding: 0.5em 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    flex-wrap: nowrap;
}
.vt-naytos-pvm { font-weight: 700; flex: 0 0 auto; }
.vt-naytokset-list .vt-naytos-pvm { width: auto; white-space: nowrap; flex: 0 0 auto; }
.vt-naytos-nimi { flex: 1 1 auto; }
.vt-naytokset-list .vt-naytos-jaljella { white-space: nowrap; flex: 0 0 auto; margin-left: 0; }
.vt-naytokset-list .vt-naytos-linkki { white-space: nowrap; flex: 0 0 auto; }
.vt-naytos-linkki { color: var(--contrast, #1A1A40); font-weight: 600; text-decoration: none !important; }
.vt-naytos-linkki:hover { opacity: 0.7; }
.vt-naytokset-icons { display: flex; gap: 2em; flex: 0 0 auto; align-self: center; }
.vt-naytokset-icon-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
    text-decoration: none !important;
    color: var(--contrast, #1A1A40);
    font-weight: 600;
    font-size: 0.9em;
}
.vt-naytokset-icon {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--contrast, #1A1A40);
}
.vt-naytokset-icon-link:hover .vt-naytokset-icon { opacity: 0.8; }

/* ===== Ohjelmisto-kortin Osta liput -nappi kuvan paalla ===== */
.vt-ajk-card-img { position: relative; height: 200px; }
.vt-ajk-card-img-btn {
    position: absolute;
    right: 0.8em;
    bottom: 0.8em;
    background: linear-gradient(135deg, #F4D58D 0%, var(--accent, #EDC263) 60%, #C99A3C 100%);
    color: #1A1A40 !important;
    font-weight: 700;
    font-size: 0.85em;
    padding: 0.55em 1.1em;
    border-radius: 3px;
    text-decoration: none !important;
}

/* ===== Onnistunut vierailu -ikonirivi ===== */
.vt-vierailu-section {
    text-align: center;
    padding: 3em 1.5em;
    max-width: 1240px;
    margin: 0 auto;
    position: relative;
}
.vt-vierailu-section::before,
.vt-vierailu-section::after {
    content: "";
    position: absolute;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    height: 3px;
    background: var(--accent, #EDC263);
}
.vt-vierailu-section::before { top: 0; }
.vt-vierailu-section::after { bottom: 0; }
.vt-vierailu-section h2 { margin: 0 0 1.5em; }
.vt-vierailu-row {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 2em;
}
.vt-vierailu-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.7em;
    text-decoration: none !important;
    color: var(--contrast, #1A1A40);
    font-weight: 600;
    max-width: 140px;
}
.vt-vierailu-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 2px solid var(--accent, #EDC263);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
}
.vt-vierailu-item:hover .vt-vierailu-icon { background: var(--contrast, #1A1A40); border-color: var(--contrast, #1A1A40); }

/* ===== Lahjakortti-banneri ===== */
.vt-lahjakortti-banner {
    position: relative;
    overflow: hidden;
    background: var(--contrast, #1A1A40);
    color: #fff;
    padding: 3.5em 1.5em;
    margin: 0 0 2em 0; /* ei tilaa ylhaalla - ulottuu Onnistunut vierailu -osion keltaiseen alaviivaan */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.vt-lahjakortti-ribbon { position: absolute; inset: 0; pointer-events: none; }
.vt-lahjakortti-ribbon::before,
.vt-lahjakortti-ribbon::after {
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    width: 220px;
    height: 280px;
}
.vt-lahjakortti-ribbon::before {
    top: -12%;
    left: -1.5%;
    background-image: url('https://varkaudenteatteri.fi/wp-content/themes/generatepress-child/assets/icons/lahjakortti-left.png');
    background-position: top left;
}
.vt-lahjakortti-ribbon::after {
    bottom: -12%;
    right: -1.5%;
    background-image: url('https://varkaudenteatteri.fi/wp-content/themes/generatepress-child/assets/icons/lahjakortti-right.png');
    background-position: bottom right;
}
@media (max-width: 700px) {
    .vt-lahjakortti-ribbon::before,
    .vt-lahjakortti-ribbon::after { width: 130px; height: 165px; }
}
.vt-lahjakortti-content { position: relative; max-width: 1240px; margin: 0 auto; max-width: 560px; }
.vt-lahjakortti-content h2 { color: var(--accent, #EDC263); font-size: 2em; margin: 0 0 0.4em; }
.vt-lahjakortti-content p { margin: 0 0 1.2em; opacity: 0.95; line-height: 1.6; }

@media (max-width: 700px) {
    .vt-naytokset-inner { flex-direction: column; }
    .vt-naytokset-icons { align-self: flex-start; }
}




/* ===== Ajankohtainen-sivu (Terhin "Ajankohtaista" -leiska) ===== */
.vt-ajk-hero-img {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    height: 45vh;
    min-height: 280px;
    max-height: 480px;
    background-size: cover;
    background-position: center;
}
.vt-ajk-body-wrap { max-width: 800px; margin: 2.5em auto 0; padding: 0 1.5em; }
.vt-ajk-title { color: var(--contrast, #1A1A40); font-weight: 800; margin: 0.2em 0 0.3em; }
.vt-ajk-meta { opacity: 0.6; font-size: 0.85em; margin: 0 0 1em; }
.vt-ajk-ingressi { font-weight: 700; font-style: italic; color: var(--contrast, #1A1A40); font-size: 1.15em; margin: 0 0 1.2em; }
.vt-ajk-content { line-height: 1.75; }
.vt-ajk-content .wp-block-gallery,
.vt-ajk-content .blocks-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.9em;
    list-style: none;
    padding: 0;
    margin: 2em 0;
}
.vt-ajk-content .wp-block-gallery figure,
.vt-ajk-content .blocks-gallery-grid figure { margin: 0; aspect-ratio: 1 / 1; overflow: hidden; }
.vt-ajk-content .wp-block-gallery img,
.vt-ajk-content .blocks-gallery-grid img { width: 100%; height: 100%; object-fit: cover; display: block; }

.vt-ajk-muut-section {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    background: #f7f7f5;
    padding: 3em 1.5em;
    margin-top: 3em;
}
.vt-ajk-muut-otsikko { max-width: 1240px; margin: 0 auto 1.2em; color: var(--contrast, #1A1A40); }
.vt-ajk-muut-grid { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2em; }
.vt-ajk-muut-card { display: block; text-decoration: none !important; color: inherit; }
.vt-ajk-muut-img { width: 100%; aspect-ratio: 4 / 3; background: var(--contrast, #1A1A40); background-size: cover; background-position: center; border-radius: 3px; }
.vt-ajk-muut-img-tyhja {
    background-image: url('https://varkaudenteatteri.fi/wp-content/themes/generatepress-child/assets/icons/vt-ajk-placeholder.jpg');
    background-size: cover;
    background-position: center;
}
.vt-ajk-muut-title { color: var(--contrast, #1A1A40); font-weight: 700; margin: 0.7em 0 0.4em; font-size: 1.05em; }
.vt-ajk-muut-excerpt { font-size: 0.9em; opacity: 0.75; margin: 0 0 0.5em; line-height: 1.5; }
.vt-ajk-muut-lue { font-weight: 700; font-size: 0.85em; color: var(--contrast, #1A1A40); }

@media (max-width: 780px) {
    .vt-ajk-muut-grid { grid-template-columns: 1fr; }
    .vt-ajk-content .wp-block-gallery,
    .vt-ajk-content .blocks-gallery-grid { grid-template-columns: 1fr; }
}

/* Oikea logo (custom_logo) korvasi tekstilogon - piilota paallekkainen
   tekstinen sivuston nimi, joka WP/GP nayttaa oletuksena logon ohella. */
.site-branding .main-title { display: none; }

/* Header-logo samaan kokoon kuin footerin logo (160px leveys, sama kuvasuhde). */
.site-logo img { width: 110px; height: auto; display: block; }
.site-logo { padding: 10px 12px; display: inline-block; }

/* Ajankohtaista-korttien placeholder-kuva, kun artikkelilla ei ole omaa
   nostokuvaa (etusivun nosto, arkistolistaus, yksittainen sivu). */
.vt-ajk-card-img {
    background-image: url('https://varkaudenteatteri.fi/wp-content/uploads/2026/10/vt-ajk-card.webp');
    background-size: cover;
    background-position: center;
}
.vt-ajk-card-img-placeholder img { display: none; }
.vt-ajk-hero-img-placeholder {
    background-image: url('https://varkaudenteatteri.fi/wp-content/uploads/2026/10/vt-palvelu-hero-scaled.webp');
    background-size: cover;
    background-position: center;
}

/* Ohjelmisto- ja Ajankohtaista-ARKISTOSIVUJEN (ei etusivun osioiden) otsikon
   yläpuolinen tila isommaksi. */
body.post-type-archive-esitys .vt-esitys-title,
body.post-type-archive-ajankohtainen .vt-esitys-title {
    margin-top: 50px;
}


/* ===== Murupolku (breadcrumbs) ===== */
.vt-breadcrumbs {
    width: 100%;
    background: #f5f5f2;
    border-bottom: 1px solid #e5e5e0;
    margin-bottom: 50px;
}
.vt-breadcrumbs-inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0.7em 1.5em;
    font-size: 0.82em;
    color: #666;
}
.vt-breadcrumbs-inner a { color: #666; text-decoration: none !important; }
.vt-breadcrumbs-inner a:hover { color: var(--accent, #7a1f2b); }
.vt-breadcrumbs-sep { margin: 0 0.5em; opacity: 0.5; }
.vt-breadcrumbs-current { color: #333; font-weight: 600; }
body.home .vt-breadcrumbs { display: none; }
/* Esitys-sivulla murupolku istuu sinisen hero-palkin ALLA olevan harmaan
   faktarivin sisassa - ei omaa taustaa/reunaa, sulautuu suoraan siihen. */
.vt-fact-row .vt-breadcrumbs {
    background: transparent;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    margin: -1.2em -1.5em 0.9em -1.5em;
}
.vt-fact-row .vt-breadcrumbs-inner { padding: 0.6em 1.5em; }

/* Kaikki näytökset -listaus (vt_kaikki_naytokset shortcode) */
.vt-naytokset-listaus {
	max-width: 1000px;
	margin: 40px auto 60px;
	padding: 0 20px;
}
.vt-naytokset-kk {
	color: #1A1A40;
	font-family: Impact, sans-serif;
	font-size: 28px;
	margin-top: 50px;
	margin-bottom: 15px;
	border-bottom: 3px solid #cfb539;
	padding-bottom: 8px;
}
.vt-naytokset-kk:first-of-type { margin-top: 10px; }
.vt-naytokset-taulukko {
	width: 100%;
	border-collapse: collapse;
	font-family: "Titillium Web", sans-serif;
}
.vt-naytos-rivi td {
	padding: 10px 8px;
	border-bottom: 1px solid #e6e6e6;
	vertical-align: middle;
}
.vt-naytos-rivi:hover td { background: #f7f7f7; }
.vt-naytos-pvm { font-weight: 700; color: #1A1A40; white-space: nowrap; width: 90px; }
.vt-naytos-klo { color: #555; white-space: nowrap; width: 70px; }
.vt-naytos-nimi a { color: #1A1A40; font-weight: 600; text-decoration: none; }
.vt-naytos-nimi a:hover { color: #cfb539; }
.vt-naytos-huom { }
.vt-naytos-badge {
	display: inline-block;
	background: #e6e6e6;
	color: #1A1A40;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 3px;
}
.vt-naytos-badge.vt-naytos-myyty { background: #b00000; color: #fff; }
.vt-naytos-jaljella { display: inline-block; margin-left: 0.6em; font-size: 12px; color: #555; font-weight: 600; }
.vt-esitys-naytos-jaljella { display: inline-block; margin-left: 0.8em; font-size: 13px; color: #555; font-weight: 600; }
.vt-naytos-rivi-myyty .vt-naytos-nimi a { color: #999; }
.vt-naytos-cta { text-align: right; white-space: nowrap; }
.vt-naytos-osta {
	display: inline-block;
	background: #cfb539;
	color: #1A1A40;
	font-weight: 700;
	font-size: 13px;
	padding: 6px 14px;
	border-radius: 3px;
	text-decoration: none;
}
.vt-naytos-osta:hover { background: #1A1A40; color: #fff; }
.vt-naytokset-tyhja { text-align: center; padding: 60px 20px; color: #888; }
@media (max-width: 640px) {
	.vt-naytokset-taulukko, .vt-naytokset-taulukko tbody, .vt-naytokset-taulukko tr { display: block; }
	.vt-naytos-rivi { border-bottom: 1px solid #e6e6e6; padding: 10px 0; }
	.vt-naytos-rivi td { display: inline-block; border-bottom: none; padding: 2px 4px; }
	.vt-naytos-cta { display: block; text-align: left; margin-top: 6px; }
}

/* Kuvagallerian lightbox (single-esitys.php) */
.vt-lightbox-trigger {
	display: block;
	cursor: zoom-in;
}
.vt-lightbox-overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(10, 10, 20, 0.92);
	align-items: center;
	justify-content: center;
}
.vt-lightbox-overlay.vt-lightbox-open {
	display: flex;
}
.vt-lightbox-overlay img {
	max-width: 90vw;
	max-height: 90vh;
	object-fit: contain;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}
.vt-lightbox-close {
	position: absolute;
	top: 20px;
	right: 30px;
	color: #fff;
	font-size: 40px;
	line-height: 1;
	cursor: pointer;
	font-weight: 300;
}

/* Medialle-sivun kuvapankki (page ID 145) */
.vt-media-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin: 16px 0 32px;
}
.vt-media-thumb {
	display: block;
	position: relative;
	border-radius: 4px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	cursor: pointer;
}
.vt-media-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.2s ease;
}
.vt-media-thumb:hover img {
	transform: scale(1.04);
}
.vt-media-grid-logo {
	grid-template-columns: 220px;
}
.vt-media-thumb-logo {
	aspect-ratio: auto;
	background: #f4f4f4;
	padding: 20px;
}
.vt-media-thumb-logo img {
	object-fit: contain;
}
@media (max-width: 900px) {
	.vt-media-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
	.vt-media-grid { grid-template-columns: repeat(2, 1fr); }
}





/* ===== LUKITUT KUVASUHTEET =====
   Hero 3200x1400 (32:14), kortti 1200x630 (40:21), galleria 3:2. Ei rajautumista eri laitteilla. */
.vt-esitys-hero-img, .vt-hero-slide-image, .vt-ajk-hero-img {
    height: auto !important; min-height: 0 !important; max-height: none !important;
    aspect-ratio: 32 / 14 !important; background-size: cover; background-position: center;
}
@media (max-width: 600px) {
    .vt-hero-slide-image { height: auto !important; min-height: 0 !important; aspect-ratio: 32 / 14 !important; }
}
.vt-ajk-card-img { height: auto !important; aspect-ratio: 40 / 21 !important; }
.vt-ajk-card-img img { width: 100% !important; height: 100% !important; object-fit: cover; }
.vt-esitys-hero img { width: 100%; height: auto; aspect-ratio: 32 / 14; object-fit: cover; display: block; }
.vt-gallery { grid-auto-rows: auto !important; }
.vt-gallery img { height: auto !important; aspect-ratio: 3 / 2; object-fit: cover; }

/* Varkauden kaupungin logo footerin oikeassa reunassa */
.vt-fg-city { grid-area: city; align-self: center; justify-self: end; }
.vt-fg-city img { display: block; height: auto; width: 130px; max-width: 100%; }
@media (max-width: 900px) { .vt-fg-city { justify-self: start; } .vt-fg-city img { width: 110px; } }


/* NAV-LOW-BLOCK: matala navigaatiopalkki (referenssi tkteatteri.fi, noin 70 px) ja semibold-fontti */
.site-header .inside-header { padding-top: 8px !important; padding-bottom: 8px !important; align-items: center; }
.site-logo { padding: 0 12px 10px !important; }
.site-logo img, .site-logo .header-image { width: 72px !important; height: auto !important; }
.main-navigation .main-nav ul li > a { font-weight: 600 !important; }
@media (min-width: 769px) {
    .main-navigation .main-nav ul li > a { line-height: 50px !important; }
}

/* ILMOITUS-X-BLOCK: sulkemisruksi oikeaan reunaan EN-linkin kohdalle, ilman taustaa */
.vt-ilmoituspalkki { position: relative; }
.vt-ilmoituspalkki .vt-ilmoituspalkki-close {
    position: absolute; top: 50%; right: 64px; transform: translateY(-50%);
    width: 36px; height: 36px; padding: 0; margin: 0;
    background: transparent !important; border: 0; box-shadow: none;
    color: #fff; font-size: 26px; line-height: 1; cursor: pointer;
}
.vt-ilmoituspalkki .vt-ilmoituspalkki-close:hover,
.vt-ilmoituspalkki .vt-ilmoituspalkki-close:focus { background: transparent !important; color: var(--accent, #EDC263); }
@media (max-width: 768px) {
    .vt-ilmoituspalkki { padding-right: 3em; }
    .vt-ilmoituspalkki .vt-ilmoituspalkki-close { right: 8px; }
}

/* PAKETIT-LAYOUT-BLOCK: Teatteripaketit-sivu vastaa palvelusivujen ylaosaa, kortit 3 / rivi */
body.page-id-66 .inside-article{padding:0}
body.page-id-66 .entry-header{margin:0}
body.page-id-66 .entry-title{margin:0 0 20px}
body.page-id-66 .entry-content{margin-top:50px}
body.page-id-66 .entry-content > h2,
body.page-id-66 .entry-content > p{max-width:680px;margin-left:auto;margin-right:auto}
body.page-id-66 .entry-content > p{font-size:17px;line-height:1.7}
body.page-id-66 .entry-content > p.vt-ingressi{font-size:19.5px;line-height:1.5}
body.page-id-66 .vt-ajk-grid{grid-template-columns:repeat(3,1fr)!important}
@media(max-width:900px){body.page-id-66 .vt-ajk-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:600px){body.page-id-66 .vt-ajk-grid{grid-template-columns:1fr!important}body.page-id-66 .entry-content > h2,body.page-id-66 .entry-content > p{padding:0 16px}}

/* PAKETIT-HEADINGS-BLOCK */
body.page-id-66 .entry-content > h3{max-width:680px;margin:1.6em auto .6em;font-size:28px;line-height:1.2}
body.page-id-66 .entry-content > h3.vt-paketit-kumppanit-otsikko{max-width:none;margin:2em 0 .6em}
@media(max-width:600px){body.page-id-66 .entry-content > h3.vt-paketit-kumppanit-otsikko{padding:0 16px}}

/* MOBILE-HOME-BLOCK: etusivun mobiiliskaalaus (leveysylitys, yhtenainen 20px reunamarginaali) */
@media (max-width: 700px) {
    body.home{overflow-x:hidden}
    .vt-naytokset-section{margin-left:-30px;padding:2em 20px;box-sizing:border-box}
    .vt-naytokset-inner{flex-direction:column;align-items:stretch;gap:1.5em}
    .vt-naytokset-list{flex:0 0 auto;width:100%;max-width:100%;padding-left:0;min-width:0}
    .vt-naytos-row{display:grid;grid-template-columns:1fr auto;column-gap:1em;row-gap:2px;align-items:center}
    .vt-naytos-row .vt-naytos-pvm{grid-column:1;grid-row:1;white-space:normal}
    .vt-naytos-row .vt-naytos-nimi{grid-column:1;grid-row:2}
    .vt-naytos-row .vt-naytos-linkki{grid-column:2;grid-row:1 / span 2}
    .vt-naytokset-icons{align-self:flex-start}
    .vt-home-section{margin-left:-30px;margin-right:-30px;padding:2em 20px;max-width:none}
    .vt-vierailu-section{padding:2.5em 20px}
    .vt-vierailu-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5em .5em;justify-items:center}
    .vt-vierailu-item{font-size:14px;max-width:110px;text-align:center}
    .vt-lahjakortti-banner{padding-left:20px;padding-right:20px}
}

/* MOBILE-HOME-BLOCK-2 */
@media (max-width: 700px) {
    .vt-vierailu-row{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5em 0}
    .vt-vierailu-item{flex:0 0 33.333%;max-width:33.333%;padding:0 4px;box-sizing:border-box}
    .vt-lahjakortti-banner{padding-top:96px}
    .vt-lahjakortti-ribbon::before{width:96px;height:122px;top:0;left:0}
    .vt-lahjakortti-ribbon::after{width:96px;height:122px;bottom:0;right:0}
}

/* MOBILE-SLIDER-BLOCK: sliderin pisteet eivat jaa seuraavan osion alle */
@media (max-width: 600px) {
    .vt-hero-slider{padding-bottom:1.4em;overflow:visible}
    .vt-hero-slider-dots{position:static!important;display:flex;justify-content:center;gap:.9em;margin:.6em auto 0!important;bottom:auto;right:auto}
    .vt-hero-dot{width:12px;height:12px;position:relative}
    .vt-hero-dot::after{content:"";position:absolute;inset:-10px}
}

/* MOBILE-GUTTERS-BLOCK: 20px reunamarginaali arkisto- ja palvelusivuille */
@media (max-width: 700px) {
    body.post-type-archive .vt-esitys-title,
    body.single-palvelu .vt-esitys-title{padding-left:20px;padding-right:20px}
    body.post-type-archive .vt-ajk-grid{padding-left:20px;padding-right:20px;box-sizing:border-box}
    body.single-palvelu .vt-esitys-hero{margin-left:20px;margin-right:20px}
    body.single-palvelu .vt-section{padding-left:20px;padding-right:20px;box-sizing:border-box}
    body.page-id-66 .inside-article{padding-left:20px;padding-right:20px}
    body.page-id-66 .entry-content > h2,
    body.page-id-66 .entry-content > h3,
    body.page-id-66 .entry-content > p{padding-left:0!important;padding-right:0!important}
}

/* MOBILE-GUTTERS-BLOCK-2 */
@media (max-width: 700px) {
    body.single-palvelu .vt-section .gb-inside-container{padding-left:0;padding-right:0}
}

/* MOBILE-PAGES-BLOCK: GB-sivut (Liput, Lippujen hinnat, Yhteystiedot jne.) mobiilissa */
@media (max-width: 700px) {
    body.page .inside-article{padding-left:20px;padding-right:20px}
    body.page .entry-content .gb-inside-container{padding:28px 0!important}
    body.page .entry-content > .gb-container:first-child > .gb-inside-container{padding-top:8px!important}
    body.page .entry-content .gb-container-lip02 > .gb-inside-container,
    body.page .entry-content .gb-container-lip05 > .gb-inside-container{padding:28px 16px!important}
    body.page .entry-content .vt-lahja > .gb-inside-container{padding:0!important}
    body.page .entry-content .wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 1.2em}
    body.page .entry-content .wp-block-table table{table-layout:auto!important;width:100%;font-size:15px}
    body.page .entry-content .wp-block-table th,
    body.page .entry-content .wp-block-table td{padding:.45em .5em;word-break:normal;overflow-wrap:normal;hyphens:none}
    body.page .entry-content .wp-block-table th:first-child,
    body.page .entry-content .wp-block-table td:first-child{min-width:7.5em}
}

/* MOBILE-PAGES-BLOCK-2: myos Peruutuskaytannot-palsta (lip08) saa sisapaddingin */
@media (max-width: 700px) {
    body.page .entry-content .gb-container-lip08 > .gb-inside-container{padding:28px 16px!important}
}

/* MOBILE-MENU-BLOCK: mobiilivalikko, jokainen ylakohta avaa vain oman ryhmansa */
@media (max-width: 768px) {
    .main-navigation .main-nav ul{padding:0;margin:0}
    .main-navigation .main-nav ul li a{padding-left:20px;padding-right:20px;line-height:50px}
    .main-navigation .main-nav ul li.menu-item-has-children > a{padding-right:56px}
    #menu-item-75 > .sub-menu,#menu-item-167 > .sub-menu,#menu-item-179 > .sub-menu,#menu-item-282 > .sub-menu,#menu-item-108 > .sub-menu{
        position:static!important;width:100%!important;max-width:none!important;margin:0!important;
        box-shadow:none!important;background:rgba(255,255,255,.05)!important;left:auto!important;
    }
    .vt-mega-columns-wrap{width:100%;padding:0!important;margin:0!important}
    .vt-mega-columns{display:block;max-width:none;padding:6px 20px 12px;gap:0}
    .vt-mega-col-title{display:none}
    #menu-item-75 .vt-mega-col:not([data-pid="75"]),
    #menu-item-167 .vt-mega-col:not([data-pid="167"]),
    #menu-item-179 .vt-mega-col:not([data-pid="179"]),
    #menu-item-282 .vt-mega-col:not([data-pid="282"]),
    #menu-item-108 .vt-mega-col:not([data-pid="108"]){display:none!important}
    .vt-mega-col-list{gap:0!important}
    .vt-mega-col-list li > a.vt-mega-col-item,
    .vt-mega-col-list li > a.vt-mega-col-partner{padding:.55em 0!important;min-height:44px}
    .vt-mega-col-item-title,.vt-mega-col-partner-title{color:#fff!important;font-size:16px;font-weight:500}
    .vt-mega-col-icon{background:rgba(255,255,255,.12)}
    .vt-mega-col-partner-img{background:rgba(255,255,255,.12)}
}

/* MOBILE-MENU-BLOCK-2 */
@media (max-width: 768px) {
    .inside-header.grid-container{padding-left:20px!important;padding-right:20px!important}
    .main-navigation .inside-navigation{padding-left:0!important;padding-right:0!important}
    .main-navigation .main-nav ul li a{padding-left:0!important}
    .main-navigation .main-nav ul li.menu-item-has-children > a{padding-right:56px!important}
    #menu-item-75 > .sub-menu,#menu-item-167 > .sub-menu,#menu-item-179 > .sub-menu,#menu-item-282 > .sub-menu,#menu-item-108 > .sub-menu{
        transform:none!important;left:auto!important;right:auto!important;overflow:visible!important;
    }
    .main-navigation.toggled .main-nav ul ul.vt-mega-col-list,
    .main-navigation.toggled .main-nav ul ul ul.vt-mega-col-list{visibility:visible!important}
    .vt-mega-columns{padding-left:0;padding-right:0}
    .main-navigation .main-nav ul ul li a.vt-mega-col-item,
    .main-navigation .main-nav ul ul li a.vt-mega-col-partner{line-height:1.3!important;padding-left:0!important;opacity:1}
}

/* MOBILE-HOME-FIX: etusivu sailyttaa 30px inside-article-paddingin (osioiden negatiiviset marginaalit perustuvat siihen) */
@media (max-width: 700px) {
    body.home .inside-article{padding-left:30px;padding-right:30px}
}

/* MOBILE-MENU-BLOCK-3: alavalikon sisennys */
@media (max-width: 768px) {
    .vt-mega-columns{padding-left:20px!important;padding-right:16px!important}
}

/* MOBILE-MENU-BLOCK-4: Teatteripaketit-alavalikko pysyy ennallaan, muut saavat sisennyksen */
@media (max-width: 768px) {
    #menu-item-108 .vt-mega-columns{padding-left:0!important}
}

/* MOBILE-MENU-BLOCK-5: myos Teatteripaketit-alavalikko saa saman sisennyksen */
@media (max-width: 768px) {
    #menu-item-108 .vt-mega-columns{padding-left:20px!important}
}

/* MOBILE-NAYTOKSET-BLOCK: Kaikki naytokset -taulukko korttirivina mobiilissa */
@media (max-width: 700px) {
    body.page .vt-naytokset-listaus{padding-left:0!important;padding-right:0!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
    .vt-naytokset-taulukko{border:0!important;width:100%}
    .vt-naytokset-taulukko tr.vt-naytos-rivi{
        display:grid!important;
        grid-template-columns:auto 1fr auto;
        grid-template-areas:"pvm klo cta" "nimi nimi cta" "huom huom cta";
        column-gap:.8em;row-gap:2px;align-items:center;
        padding:14px 0!important;border-bottom:1px solid #e6e6e6!important;
    }
    .vt-naytokset-taulukko tr.vt-naytos-rivi td{display:block!important;border:0!important;padding:0!important;width:auto!important;background:transparent!important}
    .vt-naytokset-taulukko td.vt-naytos-pvm{grid-area:pvm;font-size:1.05em}
    .vt-naytokset-taulukko td.vt-naytos-klo{grid-area:klo;font-size:.95em}
    .vt-naytokset-taulukko td.vt-naytos-nimi{grid-area:nimi;font-size:1.05em}
    .vt-naytokset-taulukko td.vt-naytos-huom{grid-area:huom;margin-top:4px}
    .vt-naytokset-taulukko td.vt-naytos-huom:empty{display:none!important}
    .vt-naytokset-taulukko td.vt-naytos-cta{grid-area:cta;text-align:right;margin:0!important;align-self:center}
    .vt-naytokset-taulukko tr.vt-naytos-rivi:hover td{background:transparent!important}
}

/* MOBILE-PAGINATION-BLOCK */
@media (max-width: 700px) {
    .nav-links{padding:0 20px;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;box-sizing:border-box}
    .nav-links .page-numbers{padding:6px 2px}
}

/* OVERFLOW-FIX-BLOCK */
html { overflow-x: clip; }
.entry-content table, .vt-ajk-content table { max-width: 100%; }
@media (max-width: 768px) {
	.entry-content table, .vt-ajk-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100% !important; }
	.entry-content table td, .entry-content table th { min-width: 0; word-break: break-word; }
}

/* NAYTOS-GRID: esityssivun nayttorivit samaan ruudukkoon, nappi aina oikeassa reunassa */
.vt-esitys-naytos-row{display:grid;grid-template-columns:10.5em 6.5em 1fr max-content;align-items:center;column-gap:1.5em}
.vt-esitys-naytos-row .vt-esitys-naytos-btn{grid-column:4;justify-self:end}
.vt-esitys-naytos-row .vt-esitys-naytos-status:empty{display:block}
@media (max-width:600px){
 .vt-esitys-naytos-row{grid-template-columns:7.6em 1fr max-content;column-gap:.5em;row-gap:2px}
 .vt-esitys-naytos-row .vt-esitys-naytos-klo{white-space:nowrap}
 .vt-esitys-naytos-row .vt-esitys-naytos-pvm{grid-column:1}
 .vt-esitys-naytos-row .vt-esitys-naytos-klo{grid-column:2}
 .vt-esitys-naytos-row .vt-esitys-naytos-status{grid-column:1 / 3;grid-row:2}
 .vt-esitys-naytos-row .vt-esitys-naytos-status:empty{display:none}
 .vt-esitys-naytos-row .vt-esitys-naytos-btn{grid-column:3;grid-row:1 / span 2;align-self:center}
}

/* LIPUT-CARD-MOBILE: Alennusliput ja edut -korttien sisapadding pienemmaksi mobiilissa */
@media (max-width: 700px) {
    .vt-liput-card > .wp-block-group__inner-container { padding: 10px 0 !important; }
}

/* BREADCRUMB-TAP */
@media (max-width:700px){
.vt-breadcrumbs-inner a{display:inline-block;padding:14px 8px;margin:-14px -8px;position:relative;z-index:1}
}

/* CARD-BAR-BOTTOM: sininen faktapalkki aina kortin pohjaan, ei valkoista sen alle */
.vt-ajk-card{display:flex;flex-direction:column}
.vt-ajk-card-body{flex:1 1 auto;display:flex;flex-direction:column}
.vt-ajk-card-body > .vt-fact-row--compact{margin-top:auto !important}

/* NEWSLETTER-LIVE */
.vt-newsletter-btn{cursor:pointer !important}
.vt-newsletter-btn:not(:disabled){background:var(--accent,#EDC263) !important;color:#1A1A40 !important}
.vt-newsletter-btn:not(:disabled):hover{filter:brightness(1.08)}
.vt-newsletter-btn:disabled{opacity:.6;cursor:wait !important}
.vt-newsletter-status{margin:.6em 0 0;font-size:.85em;line-height:1.4;color:#fff}
