#colophon .wp-block-columns a {
  color: #919191;
}
/* ------------------------------------------------------------------
   it-security.dk  ·  button and link colour
   Option A "Deep ink", agreed 2026-08-26.
   Revised 2026-08-27 after measuring the link half against five live
   pages. See "Link scope" below: the first version turned the site
   title and the main menu blue on every page.

   HOW TO USE: paste this at the END of the existing Additional CSS, below the
   #colophon rule that is already there. Do not replace the box contents.

   Why this exists: Balasana's generated custom-colors-css lists rest,
   hover and focus in one selector group with one value, so no button
   and no link on the site changes colour on hover, and :focus is
   invisible. These rules add the missing states.

   Specificity note, buttons: the generated block uses
   .wp-block-button__link:not([class*=background-color]):hover  (0,3,0).
   The button rules below are prefixed with `body` to clear it. Dropping
   the prefix makes them silently do nothing.

   Specificity note, links: the opposite applies. The theme paints links
   with a bare `a` selector at (0,0,1), and then deliberately paints the
   site title and the main menu back to #1d1e1e with `.site-title a` and
   `.main-navigation a` at (0,1,1). So the link rule here must ALSO be a
   bare `a`, winning on source order alone. Adding `body` or a `:not()`
   raises it above those two theme rules and turns the whole header
   blue. Measured on / /about/ /services/ /identity-access-management/
   and /it-security-package/ on 2026-08-27.
   ------------------------------------------------------------------ */

:root {
  --ganc-blue-900: #062E74;  /* pressed                                */
  --ganc-blue-700: #0B47AE;  /* rest: buttons and links                */
  --ganc-blue-600: #1457C9;  /* hover, and buttons on the dark band    */
  --ganc-blue-100: #EAF1FC;  /* tints                                  */

  /* The theme applies .has-primary-color with !important, so the only
     way to reach it is to redefine the variable it reads. Defined on
     :root in global-styles-inline-css, which loads before this box. */
  --wp--preset--color--primary: #0B47AE;
}

/* ---------- solid buttons ---------- */

body .wp-block-button__link:not([class*=background-color]),
body .wp-block-file__button,
body .wp-block-search .wp-block-search__button,
body .button,
body button,
body input[type="submit"],
body .has-primary-background-color {
  background-color: var(--ganc-blue-700);
  transition: background-color .15s ease, box-shadow .15s ease;
}

body .wp-block-button__link:not([class*=background-color]):hover,
body .wp-block-file__button:hover,
body .wp-block-search .wp-block-search__button:hover,
body .button:hover,
body button:hover,
body input[type="submit"]:hover {
  background-color: var(--ganc-blue-600);
  box-shadow: 0 4px 14px rgba(11, 71, 174, .22);
}

body .wp-block-button__link:not([class*=background-color]):active,
body .wp-block-file__button:active,
body .wp-block-search .wp-block-search__button:active,
body .button:active,
body button:active,
body input[type="submit"]:active {
  background-color: var(--ganc-blue-900);
  box-shadow: none;
}

/* ---------- outline buttons ---------- */

body .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color) {
  color: var(--ganc-blue-700);
  border-color: var(--ganc-blue-700);
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

body .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color):hover {
  background-color: var(--ganc-blue-700);
  border-color: var(--ganc-blue-700);
  color: #fff;
}

body .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color):active {
  background-color: var(--ganc-blue-900);
  border-color: var(--ganc-blue-900);
  color: #fff;
}

/* ---------- keyboard focus, which the theme never defines ---------- */

body .wp-block-button__link:focus-visible,
body .wp-block-file__button:focus-visible,
body .button:focus-visible,
body button:focus-visible,
body input[type="submit"]:focus-visible,
body a:focus-visible {
  outline: 3px solid rgba(11, 71, 174, .55);
  outline-offset: 3px;
}

/* ---------- links ----------
   Bare `a` on purpose. Read the "Specificity note, links" comment at the
   top of this file before adding anything in front of it. */

a {
  color: var(--ganc-blue-700);
  transition: color .15s ease;
}

a:hover {
  color: var(--ganc-blue-600);
}

/* The theme lists these hover and active states in its own group at a
   higher specificity than `a:hover`, all set to the old #0055cc. They
   are re-listed verbatim here so source order carries the new value.
   Without this block the post titles and the meta lines would still
   hover to the old blue.

   DELIBERATELY ABSENT: `.main-navigation a:hover`. The theme declares a
   blue hover for the main menu, but a more specific rule suppresses it,
   so menu items do not react to hover today. Adding that one selector
   here would win and start the menu hovering blue on every page. Artur
   chose to leave the header behaviour alone on 2026-08-27. Do not add
   it back without asking. `.site-title a:hover` IS included, because
   that one already hovers blue today and would otherwise be stranded on
   the old #0055cc. */

.a8c-posts-list .a8c-posts-list-item__title a:active,
.a8c-posts-list .a8c-posts-list-item__title a:focus,
.a8c-posts-list .a8c-posts-list-item__title a:hover,
.a8c-posts-list__item .a8c-posts-list-item__meta a:active,
.a8c-posts-list__item .a8c-posts-list-item__meta a:hover,
.comment-meta .comment-author .fn a:active,
.comment-meta .comment-author .fn a:focus,
.comment-meta .comment-author .fn a:hover,
.comment-meta .comment-metadata a:active,
.comment-meta .comment-metadata a:hover,
.entry-footer a:active,
.entry-footer a:hover,
.entry-meta a:active,
.entry-meta a:hover,
.entry-title a:active,
.entry-title a:focus,
.entry-title a:hover,
.footer-navigation .footer-menu a:hover,
.page-title a:active,
.page-title a:focus,
.page-title a:hover,
.post-navigation a:active .post-title,
.post-navigation a:focus .post-title,
.post-navigation a:hover .post-title,
.site-info a:hover,
.site-title a:hover,
.social-navigation a:hover {
  color: var(--ganc-blue-600);
}

/* accents that read off the primary colour */
body .wp-block-quote {
  border-left-color: var(--ganc-blue-700);
}

body input[type="text"]:focus,
body input[type="email"]:focus,
body input[type="tel"]:focus,
body input[type="url"]:focus,
body input[type="search"]:focus,
body textarea:focus,
body select:focus {
  border-color: var(--ganc-blue-700);
}
/* ---------- button links must not underline ----------
   Added 2026-08-27 after measuring /contact/.

   Balasana's underline group reads:

     .has-background a:not(.wp-block-button__link):not(.wp-block-file__button),
     a:active, a:focus, a:hover, ... { text-decoration: underline }

   The first selector deliberately excludes block buttons, so underlining
   them was never the theme author's intent. The bare `a:hover` in the same
   group carries no such exclusion, so every .wp-block-button__link on the
   site underlines on hover. Found on /contact/, where the Cal.com booking
   button is an <a class="wp-block-button__link">, but it is site-wide.

   Specificity: .wp-block-button__link:hover is (0,2,0) and beats the
   theme's a:hover at (0,1,1). Scoped to buttons on purpose, so ordinary
   text links keep their underline. Do NOT prefix with `body`: see the
   "Specificity note, links" trap at the top of this file.

   Verified in the browser against the live contact page with all 18
   stylesheets loaded locally: text-decoration-line resolved to `underline`
   before and `none` after. */

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-block-button__link:active,
.wp-block-file__button:hover,
.wp-block-file__button:focus,
.wp-block-file__button:active {
  text-decoration: none;
}
/* ---------- contact form submit button ----------
   Added 2026-08-27 after measuring /contact/ at 1440px.

   Jetpack renders the submit as <button class="pushbutton-wide"> and
   .pushbutton-wide forces width:100%. Inside the form's container that
   made it a 1006px solid blue bar sitting flush against the textarea
   with a 0px gap, so it read as part of the field, not as a button.

   That 0px gap is also the "wrong cursor": with no space between them,
   the pointer approaching the button is still over the textarea, which
   is cursor:text and carries the resize grabber in its bottom-right
   corner. Nothing was ever wrong with the button's own cursor, which
   measured `pointer` across its whole box.

   Measured before: submit 1006x55, gap 0.
   Measured after:  submit  200x55, gap 24.

   NOTE: this does NOT fix the form's overall width. The form renders at
   1006px against the site's 750px text column because the columns block
   wrapping it is set to Wide width in the block editor. Fix that in the
   editor, not here. */

.contact-form button.pushbutton-wide,
.contact-form input[type="submit"] {
  width: auto;
  min-width: 200px;
  margin-top: 24px;
}
/* Belt and braces on the cursor. Balasana already sets
   `button, a { cursor: pointer }` and both /contact/ buttons measured
   `pointer` across their whole box, so this changes nothing today. It pins
   the hand cursor so a theme or plugin update cannot quietly drop it. */

.wp-block-button__link,
.wp-block-file__button,
button,
input[type="submit"] {
  cursor: pointer;
}
/* ---------- contact form submit: centre it, match the button scale ----------
   Added 2026-08-27. Extends the .pushbutton-wide rule above.

   Why CSS and not the editor: the submit button is NOT a block. The page's
   jetpack/contact-form block contains only field blocks (field-name,
   field-email, field-telephone, field-text, field-textarea). Jetpack's PHP
   renderer emits <button type="submit" class="pushbutton-wide"> at render
   time, so the button has no toolbar, no Advanced panel, no Additional CSS
   class field, and cannot be selected in List View. CSS is the only handle.

   It was never missing the theme styling: it already inherits deep ink,
   the hover, the 4px radius and the 16px padding from the `body button`
   group further up this file. The only measured difference against
   .wp-block-button__link was font-size, 20px against 16.67px, so it is
   matched here using the theme's own 0.8333333333rem.

   Centring: display:block plus auto margins. Do NOT use
   text-align:center on .contact-form, which centres every field label too.
   Measured after: submit 200x47 centred, leftGap 275 = rightGap 275,
   labels still left, gap above the button still 24px. */

.contact-form button.pushbutton-wide,
.contact-form input[type="submit"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.8333333333rem;
}
/* ---------- plain <button> hover: take it back from Balasana's green ----------
   Added 2026-08-27. Site-wide, not just the contact form.

   Measured on /contact/: the submit button rested on deep ink correctly
   but hovered to rgb(20,95,62), #145F3E, a darkened shade of Balasana's
   default green #19744C. Block buttons were unaffected, so this only
   showed up on real <button> elements.

   Cause is the specificity trap again, in a new place. The rules that
   match a plain button on hover, in document order:

     [balasana]  button:not(.has-background):hover   (0,2,1)  green
     [deep ink]  body button:hover                   (0,1,2)  blue

   (0,2,1) beats (0,1,2) on class count, so the theme won despite loading
   first. The `body` prefix that fixes .wp-block-button__link is not
   enough here, because the theme's own selector already carries a
   :not() class. Mirroring it with the body prefix gives (0,2,2).

   :active was already correct, the theme declares no matching active
   rule, but it is pinned here so the pair cannot drift apart later.

   Verified: submit and Cal button now identical at rest
   rgb(11,71,174), hover rgb(20,87,201), active rgb(6,46,116). */

body button:not(.has-background):hover,
body input[type="submit"]:not(.has-background):hover {
  background-color: var(--ganc-blue-600);
}

body button:not(.has-background):active,
body input[type="submit"]:not(.has-background):active {
  background-color: var(--ganc-blue-900);
}
/*headline*/
.single-post .entry-title .wp-block-heading { font-size: 32px; }

/* Blog page (posts index) at the same wide width as the pages' alignwide blocks.
   Balasana caps post content at 750px via a high-specificity :not() chain, hence #main.
   Measured 2026-09-27: 1006px at >=1024px, identical to .entry-content > .alignwide. */
@media only screen and (min-width: 1024px) {
  body.blog #main .entry-header.responsive-max-width,
  body.blog #main .entry-footer.responsive-max-width,
  body.blog #main .entry-content > :not(.alignfull) {
    width: 1006px;
    max-width: calc(100% - 32px);
  }
}
/*Menu color mobile */
body .button:not(.has-background):hover { background-color: var(--ganc-blue-600); }
body .button:not(.has-background):active { background-color: var(--ganc-blue-900); }