/* ============================================================================
   GeneratePress Child Theme — base.css
   Typography, headings, links, layout primitives, scrollbars, 404, text/article/container, general textmarker
   ============================================================================ */

/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://www.scanado.de
 Description:  SCANADO GeneratePress child theme
 Author:       SCANADO
 Author URI:   https://www.scanado.de
 Template:     generatepress
 Version:      1.0.7
 Build:        22a 
*/

/* SCANADO page design
   ========================================================================== */
body {
  hyphens: auto;
}

/*
  #primary
    a[target="_blank"]:not(
      .gb-button,
      .eb-button-anchor
    )::after {
    content: "\e013" !important;
    font-family: "ScanadoIcoWeb" !important;
    padding: 0 4px;
  }
*/

.blockset {
  hyphens: auto;
  text-align: justify;
}

.s5o-col2 {
  column-gap: 2rem;
  column-count: 2;
}

.s5o-top {
  z-index: 500;
}

.s5o-spacer {
  margin-bottom: 100px;
}

.s5o-footnotes {
  font-size: 0.8rem;
  margin-bottom: 2rem;
  color: var(--s5o-deep-cyan); /* COLMIG: was s5o-c-blue-dark-1 (1:1 match) */
}

.s5o-cta-pricetables .wp-block-columns {
  margin-bottom: 0.5rem;
}

/* links */

/* underline in content areas */
/*
.gb-container p a {
  text-decoration: underline;
  text-underline-offset: 0.3em;
}
*/
/* underline in content areas - exceptions */
.s5o-hero p a,
p a.s5o-button,
p a.s5o-btn,
p a.gb-button,
.wp-block-rank-math-toc-block p a,
.s5o-footer-products p a {
  text-decoration: none;
}

p a[href^="mailto:"],
a[href^="mailto:"] {
  white-space: nowrap;
  text-decoration: none;
  font-weight: bold;
}

p a[href^="tel:"],
a[href^="tel:"] {
  white-space: nowrap;
  text-decoration: none;
  font-weight: bold;
}

/* link icons */
/*
a[href^="mailto:"]::before {
  padding: 0 4px;
  content: "\e051" !important;
  font-family: "ScanadoIcoWeb" !important;
  font-size: 0.8rem;
  font-weight: normal;
}
a[target="_blank"]::after {
  padding: 0 4px;
  content: "\e012" !important;
  font-family: "ScanadoIcoWeb" !important;
  font-size: 0.8rem;
  font-weight: normal;  
}
*/

/* heading clones for seo */

.s5o-h1 {
  color: var(
    --s5o-text-heading
  ); /* COLMIG: was s5o-c-indigo-1 (#330066 Violett → #260a2f Aubergine) */
  font-weight: bold;
  font-size: 3rem;
  line-height: 3rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoDisplay";
  hyphens: none;
}

.s5o-h2 {
  color: var(
    --s5o-text-heading
  ); /* COLMIG: war #330066 (Violett), neu #260a2f (Aubergine) */
  font-weight: bold;
  font-size: 2.5rem;
  line-height: 2.5rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoDisplay";
  hyphens: none;
}

.s5o-h3 {
  color: var(--s5o-text-primary); /* COLMIG: was s5o-c-text (1:1 match) */
  font-weight: bold;
  font-size: 1.75rem;
  line-height: 1.75rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoDisplay";
  hyphens: none;
}

.s5o-h4 {
  color: var(--s5o-brand-secondary); /* COLMIG: 1:1 match */
  font-weight: normal;
  font-size: 1.5rem;
  line-height: 1.5rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoSans";
  hyphens: none;
}

.s5o-h5 {
  color: var(--s5o-text-primary); /* COLMIG: 1:1 match */
  font-weight: normal;
  font-size: 1.375rem;
  line-height: 1.375rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoSans";
  hyphens: none;
}

.s5o-h6 {
  color: var(--s5o-text-link); /* COLMIG: was s5o-c-copper-1 (1:1 match) */
  font-weight: normal;
  font-size: 1.25rem;
  line-height: 1.25rem;
  margin-bottom: 0.5rem;
  font-family: "ScanadoSans";
  hyphens: none;
}

/* Stick footer to bottom from https://generatepress.com/forums/topic/cant-get-menu-nav-or-footer-to-be-sticky/#post-1232453 */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.container.grid-container {
  width: 100%;
}
.site-footer {
  margin-top: auto;
}

.entry-header {
  margin-right: auto !important;
  margin-left: auto !important;
  max-width: 1200px !important;
}

.entry-content h1 {
  margin-top: 1rem;
}

.entry-content ol,
.entry-content ul {
  margin: 0 0 1.5em 1.25em;
}

.site-content .content-area {
  min-height: 600px;
}

/* Standardabstand vor allen h2, h3 */
p + .s5o-h2,
p + h2 {
  margin-top: 3rem;
}

p + .s5o-h3,
p + h3 {
  margin-top: 3rem;
}

p + .s5o-h4,
p + h4 {
  margin-top: 2rem;
}

.site-info {
  text-align: left;
}

/* Checkbox */
.ui.toggle.checkbox:not(.checked) label::after {
  content: "\e102" !important;
  color: var(
    --s5o-surface-grey-mid
  ) !important; /* COLMIG: was s5o-c-grey-2 (1:1 match) */
  font-family: "ScanadoIcoWeb" !important;
  font-size: 1rem !important;
  line-height: 27px !important;
}

.ui.toggle.checkbox.checked label::after {
  content: "\e101" !important;
  color: var(--s5o-fui-green) !important;
  font-family: "ScanadoIcoWeb" !important;
  font-size: 1rem !important;
  line-height: 27px !important;
}

math {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Layout heading spacing */

.wp-block-column .wp-block-heading:first-child {
  margin-top: 0;
}

/* ==========================================================================s
   3. MAIN LINK STYLING
   Ensures the text is aligned with the icon and takes up available space
   ========================================================================== */
.s5o-menu-order-icon {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  text-decoration: none !important;
}

/* ==========================================================================
   4. ORDER BUTTON (TRAILING ICON)
   Hidden by default, 30px square button
   ========================================================================== */
.s5o-order-btn {
  /* Default visibility: Hidden */
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out !important;

  /* Dimensions and Visuals */
  flex: 0 0 40px !important; /* Button size set to 30px */
  height: 40px !important;
  background-color: var(--s5o-brand-primary); /* Scanado Orange */
  color: white !important;
  border-radius: 4px;

  /* Center the icon inside the button */
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin-right: 1rem;
  text-decoration: none !important;
  z-index: 5;
}

/* Inner icon size for the 30px button */
.s5o-order-btn i {
  font-size: 36px;
  margin: 0;
}

/* ==========================================================================
   5. INTERACTION (HOVER)
   Show the button when the mouse enters the grid row
   ========================================================================== */
.s5o-custom-grid-row:hover {
  background-color: color-mix(
    in srgb,
    var(--s5o-surface-gold) 50%,
    transparent
  ); /* COLMIG: was s5o-c-yellow-2 (#ffdf8188 Alpha → color-mix) */
  border-radius: 8px;
}

.s5o-custom-grid-row:hover .s5o-order-btn {
  opacity: 1;
  visibility: visible;
}

/* Scale effect when hovering directly over the orange button */
.s5o-order-btn:hover {
  background-color: black;
  transform: scale(1.1);
}

/* ==========================================================================
   6. MOBILE OPTIMIZATION
   Ensure the button is always visible on touch devices (no hover state)
   ========================================================================== */
@media (max-width: 768px) {
  .s5o-order-btn {
    opacity: 1;
    visibility: visible;
  }
}

/* Social media icons */
ul.s5o-social-icons {
  margin: 1rem 0;
}

.s5o-social-icons li {
  display: inline;
  margin-right: 1rem;
}

.s5o-social-icons a {
  font-size: 2rem;
  color: white;
}

/* Browser scrollbars
   ========================================================================== */
/* Firefox */
html {
  scrollbar-color: var(--s5o-deep-cyan) white;
  /*scrollbar-width: thin;*/
}

/* WebKit and Chromiums */
::-webkit-scrollbar {
  /*width: 8px;
    height: 8px;*/
  background-color: white;
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: var(
    --s5o-brand-secondary
  ); /* COLMIG: war hardcoded 'blue', neu HKS50 Cyan #00b3d6 */
}

/* Custom 404 theme
   ========================================================================== */
.s5o-404-container {
  margin: 2rem 0;
  background-color: var(--s5o-cta-primary);
  color: black;
}

.s5o-404 {
  padding: 2rem;
}

.s5o-404 h1 {
  font-family: var(--s5o-f-text-mono);
  font-size: 8rem;
  line-height: 8rem;
  color: white;
  background: var(
    --s5o-signal-red
  ); /* COLMIG: was s5o-c-red-dark-1 (#cc4326 → #c84024, ΔE ~2) */
  display: inline-block;
  padding: 1rem;
  margin-bottom: 2rem;
}

.s5o-404 h2 {
  color: black;
  padding-bottom: 2rem;
}

.s5o-404 hr {
  background-color: black;
  height: 4px;
}

/* Text
   ========================================================================== */
body {
  font-feature-settings:
    "tnum",
    "ss01" 1 !important;
}

p {
  hyphens: auto;
}

q {
  quotes: "»" "«" "›" "‹";
}

q::before {
  content: "»";
}

q::after {
  content: "«";
}

code,
kbd,
pre,
samp {
  font-family: var(--s5o-f-text-mono), monospace !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  hyphens: none;
}

/* Article
   ========================================================================== */
.inside-article h2 {
  margin-top: 2rem;
}

/* Container
   ========================================================================== */
.entry-header h1 {
  margin-bottom: 1rem;
}

.entry-content-header h1 {
  margin-bottom: 1rem;
}

.entry-header {
  margin-top: 2em;
}
/* General Textmarker
   ========================================================================== */
mark.has-inline-color {
  background: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='89.68'%3E%3Cpath fill='%23ffea00' d='M0 0h1000v89.68H0z'/%3E%3C/svg%3E");
  background-position: center 50%;
  background-size: auto 1em;
  background-repeat: repeat-x;
  white-space: nowrap;
}

@supports (--css: variables) {
  mark.has-inline-color {
    background-position: center calc(50% + 0.1% * var(--mark-offset, 0));
    background-size: auto calc(0.01em * var(--mark-h, 100));
    background-repeat: repeat-x;
  }
}

mark.has-inline-color:after,
mark.has-inline-color:before {
  display: inline;
  position: relative;
  z-index: -1;
  content: "\00FEFF";
  color: transparent;
}

mark.has-inline-color:before {
  margin-left: -0.7ch;
  background-position:
    left 0 top 50%,
    left calc(0.4em - 1px) top 50%;
  background-size: inherit;
  background-repeat: no-repeat, no-repeat;
  padding-right: 0.7ch;
}

@supports (--css: variables) {
  mark.has-inline-color:before {
    margin-left: calc(
      -0.007ch * var(--mark-w, 100) - -0.003ch * var(--mark-indent, 0)
    );
    background-position:
      left 0 top calc(50% + 0.1% * var(--mark-offset, 0)),
      left calc(0.01em * var(--mark-h, 100) * 36 / 90 - 1px) top
        calc(50% + 0.1% * var(--mark-offset, 0));
    padding-right: calc(
      0.007ch * var(--mark-w, 100) + -0.003ch * var(--mark-indent, 0)
    );
  }
}

mark.has-inline-color:before {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35.67' height='89.68'%3E%3Cpath d='M35.67 0h-9.36C11 2.08 6.36 6.35 6.36 10.35v5.75c0 7.85 2.85 14 2.85 21.84 0 1.56-2.16 5.37-2.85 6.9-2.1 4.62-12.36 8.25-1.3 13.65C10.67 61.23.66 65.44.66 69c0 4 2.85 8.61 2.85 12.65 0 2.62.09 5.27 11.4 8.05h20.76Z' fill='%23ffea00' fill-rule='evenodd'/%3E%3C/svg%3E"),
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='89.68'%3E%3Cpath fill='%23ffea00' d='M0 0h1000v89.68H0z'/%3E%3C/svg%3E");
}

mark.has-inline-color:after {
  margin-right: -0.7ch;
  background-position:
    right 0 top 50%,
    right calc(0.44444em - 1px) top 50%;
  background-size: inherit;
  background-repeat: no-repeat, no-repeat;
  padding-right: 0.7ch;
}

@supports (--css: variables) {
  mark.has-inline-color:after {
    margin-right: calc(
      -0.007ch * var(--mark-w, 100) + -0.003ch * var(--mark-indent, 0)
    );
    background-position:
      right 0 top calc(50% + 0.1% * var(--mark-offset, 0)),
      right calc(0.01em * var(--mark-h, 100) * 40 / 90 - 1px) top
        calc(50% + 0.1% * var(--mark-offset, 0));
    padding-right: calc(
      0.007ch * var(--mark-w, 100) - -0.003ch * var(--mark-indent, 0)
    );
  }
}

mark.has-inline-color:after {
  background-image:
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40.25' height='89.68'%3E%3Cpath d='M26 32.19c0-1.7 14.25-7.5 14.25-9.19 0-1.46-19.95-2.45-19.95-3.91 0-2.29 17.1-7.4 17.1-9.89C37.4 5.33 41 2 20.3 0H0v89.68h20.3c4.09 0 8.3-4.15 8.3-6.44 0-1.64-8.3-4.41-8.3-5.35 0-3.09 14.25-5.77 14.25-8.91 0-1.09-14.25-2.69-14.25-3.79 0-4 11.4-9.47 11.4-13.45 0-3.7-11.4-5.89-11.4-9.59 0-4.5 5.7-5.46 5.7-9.96Z' fill='%23ffea00' fill-rule='evenodd'/%3E%3C/svg%3E"),
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1000' height='89.68'%3E%3Cpath fill='%23ffea00' d='M0 0h1000v89.68H0z'/%3E%3C/svg%3E");
}