/**
 * @file
 * Sagacity theme.
 *
 * In the order the D7 site applied them:
 * 1. The parts of the D7 venture_theme 7.x-1.1 (style.css and
 *    css/responsive.css, by devsaran.com, GPL v2: LICENSE.txt) that the
 *    Sagacity pages show, and the few D7 core rules they relied on
 *    (system.menus.css, the Panels column).
 * 2. The pages' own stylesheet: each D7 page body carried a near-identical
 *    <style> block (five copies); the shared rules are here once.
 * 3. The differences between those copies, per page (.sagacity-page--name).
 *
 * Element rules apply inside the Sagacity page only (#wrap.sagacity), so
 * the administration bar keeps its look. The scope is wrapped in :where(),
 * which adds no specificity, and the element part in :is(), which keeps
 * its own: each rule weighs exactly what it did on the D7 site (an element
 * rule 0,0,1), so the pages' class rules still win where they did, and these
 * still win over core's base.css (loaded earlier) as venture's did over D7's.
 */

/* ===========================================================
   1. Venture theme (and D7 core)
   =========================================================== */

/* D7 had no global border-box (core's base.css does): the pages' widths
   assume content-box, as venture's did (.container is border-box below). */
:where(.sagacity), :where(.sagacity) *, :where(.sagacity) *::before, :where(.sagacity) *::after { box-sizing: content-box; }

/* Reset (venture "Reset"): note that <b> loses its bold, as on the D7 site. */
:where(.sagacity) :is(div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, picture) { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
:where(.sagacity) :is(article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section) { display: block; }
:where(.sagacity) img { max-width: 100%; height: auto; }

/* Body & Main */
body.theme-sagacity-theme { background: #ffffff; color: rgb(5, 5, 5); font: 14px/1.6 'Open Sans', "Helvetica", Arial; -webkit-font-smoothing: antialiased; margin: 0; }
:where(.sagacity) a { color: #000000; text-decoration: none; }
#main { padding: 40px 0; }
.sagacity .container { margin: 0 auto; width: 95%; box-sizing: border-box; }
.clr:after { clear: both; content: "."; display: block; height: 0; line-height: 0; visibility: hidden; }

/* Lists */
:where(.sagacity) :is(ul, ol) { margin: 0 0 1em 1.5em; }
:where(.sagacity) ul { list-style: disc; }
:where(.sagacity) ol { list-style-type: decimal; }

/* Typography */
:where(.sagacity) :is(h1, h2, h3, h4, h5, h6) { font-weight: 600; color: rgb(0, 0, 0); line-height: 1.4em; font-family: 'Helvetica Neue', Helvetica, Arial; }
:where(.sagacity) h1 { font-size: 28pt; margin: 0 0 20px; color: #001380; }
:where(.sagacity) h2 { font-size: 14pt; color: #001380; }
:where(.sagacity) h3 { font-size: 12pt; }
:where(.sagacity) h4 { font-size: 1em; }
:where(.sagacity) p { margin: 0 0 20px; }
:where(.sagacity) em { font-style: italic; }
:where(.sagacity) strong { font-weight: 600; color: #000; }
.sagacity h1.page-title { margin: 5px 0 10px; font-size: 34pt; }

/* Header */
#header-wrap { background: #ffffff; border-bottom: 1px solid #e4e4e4; box-shadow: 0 0 3px rgba(253, 253, 253, 0.1); }
#header { text-align: left; position: relative; padding: 30px 0; }
#logo img { display: block; max-width: 100%; }

/* Main menu (venture's superfish menu, without the drop-downs: Sagacity's
   menu has one level). */
#main-menu > ul, #main-menu > ul * { margin: 0; padding: 0; list-style: none; }
#main-menu > ul { float: left; }
#main-menu > ul > li { float: left; position: relative; white-space: nowrap; }
#main-menu > ul a { display: block; position: relative; }
#site-navigation-wrap { position: absolute; right: 0; top: 50%; height: 40px; margin-top: -20px; }
#site-navigation #main-menu > ul li { display: block; float: left; height: 40px; line-height: 40px; }
#site-navigation #main-menu > ul > li { margin-left: 25px; }
#site-navigation #main-menu > ul > li:first-child { margin-left: 0; }
#site-navigation #main-menu > ul a { color: rgb(0, 0, 0); font-weight: 400; text-decoration: none; text-align: left; cursor: pointer; font-size: 12pt; }
#site-navigation #main-menu > ul > li > a:hover,
#site-navigation #main-menu > ul > li.is-active > a { color: rgb(66, 66, 66); }

/* The footer bar (venture page.tpl.php as changed for Sagacity: fixed to
   the bottom of the window). */
#copyright-wrap { background-color: #f2f2f2; color: #181a3a; text-align: center; padding: 10px; position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-between; z-index: 900; }
/* The links inline, with the spaces between them that D7's markup had. */
#copyright-wrap ul { display: block; list-style: none; margin: 0; padding: 0; }
#copyright-wrap li { display: inline; margin: 0; padding: 0; }
#copyright-wrap a { color: #181a3a; text-decoration: none; margin-right: 20px; font-size: 12px; }
.company-text { margin-right: 10px; font-size: 12px; }

/* Core's field wrapper has a bottom margin; D7's had none. */
.sagacity .field { margin: 0; }

/* The page column: the D7 page sat in a Panels region 99% wide. */
.sagacity-page { width: 99%; }

/* The menu button (narrow windows, below). */
.sagacity-menu-toggle { display: none; }

/* ===========================================================
   2. The pages' own stylesheet (shared)
   =========================================================== */

/* Typography and base reset */
body.theme-sagacity-theme { font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; color: #595959; line-height: 1.7; font-size: 1.25rem; background: #fff; margin: 0; padding: 0; }
#main-menu a { font-size: 1.25rem !important; }
:where(.sagacity) :is(h1, h2, h3) { font-weight: 600; margin-bottom: 0.5em; font-size: 1.75rem; }
:where(.sagacity) h3 { font-weight: 600; margin-bottom: 0.5em; font-size: 1.5rem; }

/* Header */
#header { background: white; padding: 20px 0; border-bottom: 1px solid #eee; position: sticky; top: 0; z-index: 1000; }
#logo img { height: 6rem; width: auto; }
#main-menu { float: right; }
#main-menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 20px; }
#main-menu ul li { display: inline-block; }
#main-menu a { text-decoration: none; color: #333; font-weight: 500; }

/* Hero Section */
.hero { background: #181a3a; color: white; padding: 60px 20px; text-align: center; }
.hero-img { color: white; padding: 60px 20px; text-align: center; background-repeat: no-repeat; background-size: cover; background-position: center; min-height: 360px; }
.hero h1 { font-size: 2rem; margin-bottom: 0.5em; color: white !important; }
.hero-text-t { margin-left: 20%; margin-right: 20%; }
.hero-text ul { list-style: disc; text-align: left; margin: 1em auto; max-width: 650px; }
.text-chip { background: #181a3a; color: #fff; opacity: 80%; padding: .35em .45em; border-radius: .35em; display: inline; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* Solutions Section */
.solutions { background: #f7f7f7; padding: 60px 20px; text-align: center; }
.solution-blocks { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; margin-top: 40px; }
.solution { flex: 1 1 250px; background: white; border-radius: 8px; padding: 20px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); }
.solutions-blue { background: #181a3a; padding: 60px 20px; text-align: center; }

/* Footer (the navy band at the foot of each page) */
.site-footer { background: #181a3a; color: white; padding: 40px 20px; text-align: center; margin-top: 40px; }

/* Charts (Why Work With Us) */
.cards.charts-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.card.chart-card { border: 1px solid var(--color-border, #e2e8f0); border-radius: 16px; background: #fff; padding: 12px; }
.card-title { margin: 4px 8px 8px; font-size: 1rem; }
.card.chart-card canvas { display: block; width: 100% !important; height: 240px !important; }

/* Team (Contact Us) */
.team-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.team-card { border: 1px solid var(--color-border, #e2e8f0); border-radius: 16px; background: #fff; padding: 12px; text-align: center; }
.avatar { aspect-ratio: 1 / 1; width: 200px; max-width: 100%; margin: 0 auto 10px; border-radius: 9999px; overflow: hidden; background: #f3f4f6; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-name { margin: 4px 0 2px; font-size: 1.5rem; font-weight: 600; }
.team-role { margin: 0; font-size: 1rem; color: #181a3a; }

/* The legal pages (new: the D7 Impressum, Privacy Policy and Disclaimer were
   Nicepage exports; their text now uses the pages' own look). */
.legal .container { max-width: 900px; text-align: left; }
.legal h2 { font-size: 1.35rem; margin: 1.6em 0 0.4em; }
.legal h2:first-child { margin-top: 0; }
.legal--impressum .container { text-align: center; }

/* ===========================================================
   3. Per page: where the pages' copies of the stylesheet differed
   =========================================================== */
.sagacity-page--homepage .solution-blocks { gap: 3rem; }
.sagacity-page--homepage .solution-blocks-blue { display: flex; flex-wrap: wrap; justify-content: center; gap: 5%; margin-top: 40px; margin-left: 10%; margin-right: 10%; }
.sagacity-page--homepage .solution-blue { flex: 1 1 250px; background: #181a3a; opacity: 80%; border-radius: 8px; padding: 20px; box-shadow: 15px 15px 10px rgba(0, 0, 0, 0.8); }
.sagacity-page--whoweare .hero-text-t { margin-left: 18%; margin-right: 18%; font-size: 1.25rem; }
.sagacity-page--whyworkwithus .solution-blocks-blue { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; margin-top: 40px; }
.sagacity-page--whyworkwithus .solution-blue { flex: 1 1 250px; background: #181a3a; border-radius: 8px; padding: 20px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); }

/* ===========================================================
   Other pages (site layout: log in, 404, pages set to Standard)
   =========================================================== */
.sagacity-page--site { padding-bottom: 60px; }
.sagacity-page--site .page-content { font-size: 1rem; line-height: 1.6; }

/* Administrators: the pages' body { padding: 0 } would cancel the room the
   administration bar keeps at the top. */
body.theme-sagacity-theme.has-admin-menu { padding-top: 2rem; }
@media (max-width: 48rem) { body.theme-sagacity-theme.has-admin-menu { padding-top: 0; } }

/* The page tools (Edit ..., for those who may edit) sit above the footer bar,
   which is fixed to the bottom of the window. */
.sagacity .page-tools { bottom: calc(54px + 1rem); z-index: 901; }

/* ===========================================================
   Narrow windows (venture css/responsive.css; D7's responsive menus)
   =========================================================== */
@media only screen and (max-width: 1100px) {
  /* Venture hid the menu below 1100 px and showed a Menu button that slid
     a panel in from the left; here the button opens the menu below the
     header. */
  #site-navigation #main-menu > ul { display: none; }
  .sagacity-menu-toggle { display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: none; border: 0; padding: 8px 4px; font: inherit; font-size: 1.1em; font-weight: 600; color: #888; cursor: pointer; }
  .sagacity-menu-toggle:hover, .sagacity-menu-toggle[aria-expanded="true"] { color: #000; }
  #site-navigation-wrap { position: static; height: auto; margin: 0; }
  #main-menu { float: none; }
  #site-navigation #main-menu.is-open > ul { display: block; float: none; position: absolute; left: 0; right: 0; top: 100%; z-index: 1001; background: #333; border-radius: 0 0 4px 4px; box-shadow: 2px 2px 2px #000; }
  #site-navigation #main-menu.is-open > ul > li { float: none; display: block; height: auto; line-height: 1.4; margin: 0; }
  #site-navigation #main-menu.is-open > ul a { color: #fff; padding: 1em 5%; border-bottom: 1px solid rgba(255, 255, 255, 0.5); text-transform: uppercase; font-size: 1rem !important; }
  #site-navigation #main-menu.is-open > ul > li:last-child a { border-bottom: none; }
  #site-navigation #main-menu.is-open > ul > li.is-active > a { color: #fff; font-weight: 700; }
}
@media only screen and (min-width: 768px) and (max-width: 1099px) {
  .sagacity .container { max-width: 85%; }
}
@media only screen and (max-width: 650px) {
  .sagacity .container { max-width: 480px; width: 90%; }
}
@media print {
  #copyright-wrap { position: static; }
  .sagacity-menu-toggle { display: none !important; }
}
