/* poe-sea.no: fonts and the PoE-Tic colors on top of the theme (theme.css, same as smartvvb.no) */

/* inter-300 - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/inter-v12-latin-300.woff2') format('woff2'),
       url('../fonts/inter-v12-latin-300.woff') format('woff');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/inter-v12-latin-500.woff2') format('woff2'),
       url('../fonts/inter-v12-latin-500.woff') format('woff');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/inter-v12-latin-700.woff2') format('woff2'),
       url('../fonts/inter-v12-latin-700.woff') format('woff');
}

:root {
  --poetic-navy: #2d297b;
  --poetic-green: #6ab42d;
  --poetic-green-dark: #4f8a1f;
}

.brand-name { font-weight: 700; font-size: 1.5rem; color: var(--poetic-navy); letter-spacing: -0.5px; }
.text-poetic { color: var(--poetic-navy) !important; }
.text-poetic-green { color: var(--poetic-green) !important; }
.bg-poetic { background-color: var(--poetic-navy) !important; color: #fff; }

.btn-poetic { background-color: var(--poetic-green); border-color: var(--poetic-green); color: #fff; }
.btn-poetic:hover, .btn-poetic:focus { background-color: var(--poetic-green-dark); border-color: var(--poetic-green-dark); color: #fff; }

/* Hero: text on the left, classroom picture on the right */
.hero-picture { background-image: url(../img/hero-banniere.jpg); background-size: cover; background-position: 60% center; }
@media (max-width: 991.98px) {
  .hero-picture { position: relative !important; height: 260px !important; width: 100%; margin-top: 110px !important; }
  .hero-text { padding-top: 2rem !important; }
  .hero-text .badge { margin-top: 0 !important; }
}

/* The three reasons, with an icon */
.reason-icon { font-size: 2.2rem; color: var(--poetic-green); }

/* Screenshots of the backend */
.screenshot { border: 1px solid #dee2e6; border-radius: .5rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.12); max-width: 100%; height: auto; background: #fff; }
.screenshot-caption { font-size: .9rem; color: #6c757d; margin-top: .75rem; }

.check-list { list-style: none; padding-left: 0; }
.check-list li { position: relative; padding-left: 1.8rem; margin-bottom: .6rem; }
.check-list li:before { content: "\f00c"; font-family: FontAwesome; position: absolute; left: 0; top: 0; color: var(--poetic-green); }

.number-big { font-size: 4rem; font-weight: 700; line-height: 1.1; color: var(--poetic-navy); }
.bg-gray-900 .number-big { color: #fff; }

/* Articles list (news.php and the front page) */
.article-row img { width: 500px; max-width: 100%; height: auto; border-radius: .375rem; }

/* Long text of the articles, policy and support pages */
.article-body h3 { font-size: 1.5rem; font-weight: 700; margin-top: 2rem; }
.article-body p, .article-body li { font-size: 1.05rem; }

.accordion-button:not(.collapsed) { color: var(--poetic-navy); background-color: #eef3e8; }

/* Contact form: hidden field against spam robots */
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }