/*
Theme Name:   VEMI (Astra child)
Theme URI:    https://vemi.ee/wp/
Description:  Child theme of Astra that reproduces the look of the old VEMI site (dark navy header, light-blue title band, Roboto, white content, dark footer). Self-hosted fonts, no third-party requests.
Author:       VEMI
Template:     astra
Version:      1.0.0
Text Domain:  vemi-astra
*/

/* ---- design tokens measured on the old site (2026-10-16) ---- */
:root {
  --vemi-navy: #222533;        /* header + footer */
  --vemi-band: #afd8ff;        /* title band, blue panels */
  --vemi-band-text: #504b4b;
  --vemi-blue: #0066aa;        /* primary button, active menu item */
  --vemi-link: #3590ea;        /* links on dark */
  --vemi-text: #222222;
  --vemi-gray: #555555;        /* three-box band on the home page */
  --vemi-zebra: #f1f1f1;
  --vemi-font: Roboto, Helvetica, Arial, sans-serif;
  --vemi-sans: Helvetica, Arial, sans-serif;   /* logo and menu use the system sans in the old theme */
  --vemi-wrap: 1250px;
}
html { scroll-behavior: smooth; }
body { font-family: var(--vemi-font); font-size: 16px; line-height: 1.5; color: var(--vemi-text); background: #fefefe; margin: 0; }
body.vemi, .vemi #page { background: #fff; }
.vemi .vemi-wrap a { color: var(--vemi-blue); text-decoration: none; }
.vemi .vemi-wrap a:hover { text-decoration: underline; }
.vemi-boxes a, .vemi-hero a { text-decoration: none; }

/* ---- header: logo on top, menu below, like the old theme ---- */
.vemi-header { background: var(--vemi-navy); color: #fff; }
.vemi-header__inner { max-width: 1280px; margin: 0 auto; padding: 10px 38px 0; }
.vemi-logo { display: inline-block; font: 600 46px/69px var(--vemi-sans); color: #fff !important; text-decoration: none; letter-spacing: 0; }
.vemi-logo:hover { color: #fff !important; }
.vemi-nav { margin-top: 10px; padding-bottom: 18px; }
.vemi-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.vemi-nav a { display: block; padding: 19px 12px; font: 600 14px/normal var(--vemi-sans); text-transform: uppercase; letter-spacing: .8px; color: #fff !important; text-decoration: none; }
.vemi-nav a:hover, .vemi-nav a:focus-visible { color: var(--vemi-band) !important; }
.vemi-nav .current-menu-item > a, .vemi-nav .current_page_item > a, .vemi-nav .current-menu-ancestor > a { color: var(--vemi-blue) !important; }
body.home .vemi-nav .current-menu-item > a, body.home .vemi-nav .current_page_item > a { color: #fff !important; }   /* the old home page had no highlighted item */
.vemi-nav a:focus-visible, .vemi-menu-toggle:focus-visible { outline: 2px solid var(--vemi-band); outline-offset: 2px; }
.vemi-menu-toggle, .vemi-menu-toggle:hover, .vemi-menu-toggle:focus, .vemi-menu-toggle:active { background: none !important; box-shadow: none !important; }
.vemi-menu-toggle { display: none; border: 0; color: #fff; font: 600 16px var(--vemi-sans); padding: 10px 0 16px; cursor: pointer; letter-spacing: .8px; text-transform: uppercase; }
@media (max-width: 960px) {
  .vemi-nav { margin-top: 0; padding-bottom: 12px; }
  .vemi-boxes .vemi-wrap { padding: 0 20px; }
  .vemi-boxes .wp-block-columns { gap: 28px; }
  .vemi-hero h1 { font-size: 64px; line-height: 68px; }
  .vemi-header__inner { padding: 8px 20px 0; }
  .vemi-logo { font-size: 38px; line-height: 56px; }
  .vemi-menu-toggle { display: block; }
  .vemi-nav { display: none; }
  .vemi-nav.is-open { display: block; padding-bottom: 12px; }
  .vemi-nav ul { flex-direction: column; }
  .vemi-nav a { padding: 12px 4px; border-top: 1px solid rgba(255,255,255,.12); }
}

/* ---- page frame: Astra's own title and containers are not used on these pages ---- */
.vemi .site-content, .vemi #content { margin: 0; padding: 0; }
.vemi .ast-container { max-width: 100%; padding: 0; display: block; }
.vemi .entry-content > *:first-child { margin-top: 0; }
.vemi .site-main, .vemi article.page, .vemi .ast-article-single { margin: 0; padding: 0; }
.vemi .entry-content { margin: 0; }
.vemi .wp-block-group.alignfull, .vemi .wp-block-cover.alignfull { max-width: none; }

/* ---- title band ---- */
.vemi-band { background: var(--vemi-band); text-align: center; padding: 61px 20px 62px !important; margin: 0 !important; }
.vemi-band h1 { margin: 0; font: 400 32px/44.8px var(--vemi-font); color: var(--vemi-band-text); }

/* ---- content width and typography (old: 14px text, 31px light headings) ---- */
.vemi-wrap { max-width: var(--vemi-wrap); margin: 0 auto; padding: 0 15px; box-sizing: border-box; }
.vemi-wrap p, .vemi-wrap li, .vemi-wrap td, .vemi-wrap th { font-size: 14px; line-height: 22.4px; }
.vemi-wrap h2.vemi-h, .vemi-wrap h3.vemi-h, .vemi-h { font: 400 31px/43.4px var(--vemi-font); color: var(--vemi-text); margin: 32px 0 12px; }
.vemi-wrap h3.vemi-hl, .vemi-wrap h2.vemi-hl { font-size: 28px; line-height: 39px; }
.vemi-wrap .vemi-lead { font-size: 15px; line-height: 24px; }
.vemi-section { padding: 28px 0; }
.vemi-wrap .wp-block-columns { gap: 36px; margin-bottom: 0; }
.vemi-wrap .wp-block-columns.vemi-features { margin-bottom: 8px; }

/* light-blue panel with role lists */
.vemi-panel { background: var(--vemi-band); padding: 20px; margin: 24px 0; }
.vemi-panel .vemi-h { margin-top: 8px; }
.vemi-panel ul { margin: 0 0 8px 20px; }

/* price table: zebra rows, light borders */
.vemi-price table, .vemi-wrap .wp-block-table table { width: 100%; border-collapse: collapse; border: 1px solid #e6e6e6; }
.vemi-price th, .vemi-price td, .vemi-wrap .wp-block-table td { padding: 10px 14px; text-align: left; border: 0; }
.vemi-price tbody tr:nth-child(even), .vemi-wrap .wp-block-table tbody tr:nth-child(even) { background: var(--vemi-zebra); }
.vemi-price tbody tr:nth-child(odd), .vemi-wrap .wp-block-table tbody tr:nth-child(odd) { background: #fff; }
.vemi-wrap .wp-block-table tr:first-child td { font-weight: 600; background: #fff; }

/* image strips: banner slider and application screenshots */
.wp-block-gallery.vemi-slider { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 0 !important; margin: 0 0 28px; padding: 0; -webkit-overflow-scrolling: touch; }
.wp-block-gallery.vemi-slider > .wp-block-image { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; scroll-snap-align: start; margin: 0 !important; }
.wp-block-gallery.vemi-slider img { display: block; width: 100% !important; height: auto !important; object-fit: cover; }
.vemi-shots { background: var(--vemi-navy); padding: 12px 8px; margin: 28px 0; }
.vemi-shots .wp-block-gallery { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px !important; align-items: start; margin: 0; }
.vemi-shots .wp-block-gallery > .wp-block-image { display: block !important; width: auto !important; max-width: none !important; margin: 0 !important; flex: none !important; }
.vemi-shots .wp-block-gallery .wp-block-image img { display: block; width: 100% !important; height: auto !important; aspect-ratio: 5 / 4 !important; object-fit: cover !important; object-position: top left; }   /* uniform thumbnails like the old Photo Gallery */
.vemi-shots figcaption { color: #fff !important; font-size: 12px; background: none !important; position: static !important; padding: 6px 2px 0 !important; text-align: center; }

/* ---- home page: hero + three boxes ---- */
.vemi-hero.wp-block-cover { min-height: 765px; padding: 0 20px; align-items: center; }
.vemi-hero h1 { font: 700 100px/103px var(--vemi-font); color: #fff; text-align: center; margin: 0 0 40px; }
.vemi-hero .wp-block-buttons { justify-content: center; gap: 28px; }
.wp-block-button.vemi-btn .wp-block-button__link, .vemi-hero .wp-block-button__link { background: var(--vemi-blue); color: #fff; border: 2px solid var(--vemi-blue); border-radius: 3px; font: 400 16px/1.2 var(--vemi-font); text-transform: uppercase; padding: 14px 30px; text-decoration: none; }
.wp-block-button.is-style-outline .wp-block-button__link, .vemi-hero .is-style-outline .wp-block-button__link { background: transparent !important; color: #fff !important; border: 2px solid #fff !important; }
.vemi-boxes { background: var(--vemi-gray); color: #fff; padding: 44px 0 52px; }
.vemi-boxes .vemi-wrap { max-width: 1280px; padding: 0 43px; }
.vemi-boxes .wp-block-columns { gap: 97px; }
.vemi-boxes h2 { font: 400 40px/56px var(--vemi-font); color: #fff; margin: 0 0 20px; }
.vemi-boxes p { color: #fff; font-size: 16px; line-height: 25.6px; }
.vemi-boxes .wp-block-button__link { background: transparent; color: #fff; border: 2px solid #fff; border-radius: 3px; text-transform: uppercase; font: 400 16px/1.2 var(--vemi-font); padding: 14px 30px; }
.vemi-boxes .wp-block-button__link:hover { background: #fff; color: var(--vemi-gray); }
.vemi-gap { height: 56px; background: #fff; }

/* ---- footer ---- */
.vemi-footer { background: var(--vemi-navy); color: #ccc; }
.vemi-footer__inner { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; padding: 20px 25px; font: 400 16px/24px var(--vemi-font); }
.vemi-footer a { color: var(--vemi-link) !important; text-decoration: none; }
.vemi-footer a:hover { text-decoration: underline; }
.vemi-footer .vemi-footer__mail a { color: #ccc !important; }

/* login / registration forms (markup from the application's form_login.php, see mu-plugin vemi-app-bridge); boxes side by side like the old site */
.vemi-appform { max-width: none; padding-left: 15px; padding-right: 15px; }
.vemi-appforms > div { display: inline-block; vertical-align: top; border: thin solid #ccc; margin: 10px; padding: 10px; box-sizing: border-box; max-width: calc(100% - 20px); }
.vemi-appforms #oauth { padding-bottom: 0; }
.vemi-appforms .borderwrap_auth { width: 220px; max-width: 100%; box-sizing: border-box; height: 24px; }
.vemi-appforms font.hw_error { color: #be2010; }
.vemi-appforms div.hw_error { color: #be2010; border: #eb5746 thin solid; outline: #f86556 solid 2px; padding: 8px 16px 8px 40px; background: url(/px/images/nd/error.gif) #fff no-repeat 10px 10px; overflow: hidden; margin: 10px 0 0 10px; display: inline-block; }
.vemi-appforms .submit { background: var(--vemi-blue); color: #fff; border: 0; border-radius: 3px; padding: 5px 8px; font-size: 11px; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.vemi-appforms .button_esteid { display: inline-block; margin: 0 0 10px; }
.vemi-appnotice { margin: 10px; padding: 10px; background: #fff4e5; border: 1px solid #e0b060; }

/* messages and the personal-ID check box of the registration page (markup/CSS of the application's templates/hwauth.tpl) */
.vemi-appforms div.hw_ok, .vemi-appforms p.hw_ok { color: #222; border: #99d658 thin solid; outline: #a8e368 solid 2px; padding: 8px 16px 8px 40px; background: url(/px/images/nd/ok.gif) #fff no-repeat 10px 10px; overflow: hidden; margin: 10px 0 0 10px; display: inline-block; }
.vemi-appforms > #checkprofile { display: block; width: auto; max-width: 500px; }
.vemi-appforms .hw_note { margin: 10px; }
