/**
 * vars
 */
:root {
    --nr-colors-primary: #3490dc;
    --nr-colors-secondary: #4dc0b5;
    --nr-bgColor-light: #fafafa;
}

/**
 * general
 */
.heading-effect {
    font-weight: bold;
    background-image: linear-gradient(90deg, var(--nr-colors-primary), var(--nr-colors-secondary), var(--nr-colors-primary));
    color: transparent;
    background-clip: text;
}

[lang="en"] .page-1 .header-bar,
[lang="en"] .page-1 .header-bar-suggestSearch .fa {
    color: #333;
}

.btn-container {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-container--center {
    justify-content: center;
}

@media (max-width: 767px) {
    .btn-container > .btn {
        width: 100%;
    }
}

/* Button stack: always stacked and full width */
.btn-stack {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.btn-stack > .btn {
    width: 100%;
}

/**
 * Page header
 */
.page-header-inner {
    background: #1972F5D8;
}

/**
 * Hero brick (2026)
 */
[lang="en"] body .headerHero-content {
    color: inherit;
}

[lang="en"] .headerHero-content-wrapper {
    position: relative;
    z-index: 0;
    color: inherit;
}

[lang="en"] @media screen and (max-width: 767px) {
    .headerHero-content-wrapper {
        padding: 100px 0 40px !important;
    }
}

[lang="en"] .headerHero-content-wrapper:before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 20vw 40vh, #3490dc3b, transparent 30%), radial-gradient(circle at 75vw 90vh, #4dc0b54e, transparent 50%);
    mask: linear-gradient(0, transparent 0, white 40%);
    background-size: cover;
}

@media screen and (max-width: 767px) {
    [lang="en"] .headerHero-content-wrapper:before {
        background: radial-gradient(circle at 10vw 20vh, #3490dc2b, transparent 30%), radial-gradient(circle at 75vw 70vh, #4dc0b52e, transparent 30%);
    }
}

[lang="en"] .headerHero-content-wrapper__body {
    width: 100%;
}

/* Startpage Products (2026) */
.nr-startpage-products__items {
    margin-top: 4rem;
    gap: clamp(1rem, 5%, 3rem);
}

@media screen and (max-width: 767px) {
    .nr-startpage-products__items {
        flex-direction: column;
        gap: 6rem;
    }
}

.nr-startpage-products-item {
    background-color: #ffffff;
    box-shadow: rgb(174 211 231 / 58%) 0px 10px 20px -3px, rgb(136 140 144 / 48%) 0px 4px 6px -2px;
    display: flex;
    flex-direction: column;
    border-radius: 1rem;
    background-image:
            linear-gradient(155deg, transparent 65%, color-mix(in srgb, var(--nr-colors-primary), transparent 90%)),
            linear-gradient(155deg, transparent 85%, color-mix(in srgb, var(--nr-colors-secondary), transparent 80%)),
            linear-gradient(-35deg, transparent 85%, color-mix(in srgb, var(--nr-colors-primary), transparent 94%)),
            linear-gradient(-30deg, transparent 90%, color-mix(in srgb, var(--nr-colors-secondary), transparent 80%));
    transition: all 0.25s ease;
}

@media screen and (hover: hover) {
    .nr-startpage-products-item:hover {
        transform: translateY(-8px);
        box-shadow: rgb(174 211 231 / 70%) 0px 10px 30px -3px, rgb(136 140 144 / 50%) 0px 4px 46px -2px;
    }
}

.nr-startpage-products-item__image img {
    margin-top: -5rem;
    margin-bottom: -1rem;
}

.nr-startpage-products-item__body {
    padding: 1rem 1.5rem;
    flex-grow: 1;
}

/**
 * Product banner (2026)
 */
.nr-product-banner .quiqqer-textImage {
    --color-1: var(--nr-colors-primary);
    --color-2: var(--nr-colors-secondary);
    background-color: #ffffff;
    box-shadow: rgb(174 211 231 / 58%) 0 10px 20px -3px, rgb(136 140 144 / 48%) 0 4px 6px -2px;
    border-radius: 1rem;
    background-image: linear-gradient(155deg, transparent 65%,
        color-mix(in srgb, var(--color-1), transparent 90%)), linear-gradient(155deg, transparent 85%,
        color-mix(in srgb, var(--color-2), transparent 80%)), linear-gradient(-35deg, transparent 85%,
        color-mix(in srgb, var(--color-1), transparent 94%)), linear-gradient(-30deg, transparent 90%,
        color-mix(in srgb, var(--color-2), transparent 80%));
}

.nr-product-banner .quiqqer-textImage-content {
    padding: 2rem !important;
}

/*
 * Startpage - who is namerobot for
 */
.brick-id-79 {
    background: var(--nr-bgColor-light);
}

.verticalTabSwitcher-nav-entry.active {
    background-color: #fff;
}

/**
 * Table
 */
.content-body table {
    width: 100%;
    table-layout: auto;
    text-align: left;
    margin-top: 2em;
    margin-bottom: 2em;
    min-width: 800px;
    font-size: 0.95em;
}

.content-body thead {
    border-bottom: 1px solid #ddd;
}

.content-body thead th {
    padding-right: 0.75em;
    padding-bottom: 0.75em;
    padding-left: 0.75em;
    color: #333;
    font-weight: bold;
    vertical-align: baseline;
}

.content-body thead th:first-child {
    padding-left: 0;
}

.content-body thead th:last-child {
    padding-right: 0;
}

.content-body tbody tr {
    border-bottom: 1px solid #ddd;
}

.content-body :is(tbody td, tfoot td) {
    vertical-align: baseline;
    padding: 0.75em;
}

.content-body :is(tbody td:first-child, tfoot td:first-child) {
    padding-left: 0;
}

.content-body :is(tbody td:last-child, tfoot td:last-child) {
    padding-right: 0;
}


.page-multiple-sidebar-wrapper {
    position: sticky; /* menu height */
    top: 80px; /* create new stack --> margin + padding */
    z-index: 1;
}

/****************/
/* html5tooltip */
/****************/
.html5tooltip-box {
    background-color: #2A2A2A;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .15), 0 0 10px rgba(255, 255, 255, .15);
    color: #F7F7F7;
    font-weight: normal;
    font-family: inherit;
    font-size: 12px;
    line-height: 1.7;
}

.html5tooltip-box .html5tooltip-text {
    padding: 1rem;
}

/**************/
/* extra link */
/**************/
/* simple */
a.hover-effect-simple {
    position: relative;
    text-decoration: none;
}

a.hover-effect-simple:after {
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 2px solid;
    position: absolute;
    left: 0;
    bottom: -2px;
    opacity: 0.5;
}

a.hover-effect-simple:hover:after,
a.hover-effect-simple:active:after {
    opacity: 1;
}

/* underline effect */
a.hover-effect-underline {
    padding: 2px 2px;
    color: inherit;
    background-image: linear-gradient(45deg, #e06164c2, #bb111594);
    background-position: left bottom;
    background-size: 100% 8px;
    background-repeat: no-repeat;
    transition: all 0.175s ease-out;
}

a.hover-effect-underline:hover {
    text-decoration: none;
    background-size: 100% 100%;
}

a.hover-effect-underline {
    padding: 2px 2px;
    color: inherit;
    background-image: linear-gradient(45deg, #e06164c2, #bb111594);
    background-position: left bottom;
    background-size: 100% 8px;
    background-repeat: no-repeat;
    transition: all 0.175s ease-out;
}

a.hover-effect-underline:hover {
    text-decoration: none;
    background-size: 100% 100%;
}

/************/
/* messages */
/************/
.body-container .content-message-error,
.body-container .content-message-success,
.body-container .content-message-attention,
.body-container .content-message-information {
    box-shadow: 0 15px 30px 0 rgba(0, 0, 0, 0.11), 0 5px 15px 0 rgba(0, 0, 0, 0.08);
    padding: 1rem 2rem;
    border-radius: 0.5rem;
    background: #eef6fb;
    z-index: 1;
    overflow: hidden;
    float: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.body-container .content-message-error:before,
.body-container .content-message-success:before,
.body-container .content-message-attention:before,
.body-container .content-message-information:before {
    line-height: 1;
    font-size: 150px;
    width: auto;
    height: auto;
    z-index: -1;
    top: -0.25em;
    transform: rotate(15deg);
    left: -0.1em;
}

.body-container .content-message-error {
    background: #f8eeec;
}

.body-container .content-message-success {
    background: #ebf1e0;
}

.body-container .content-message-attention {
    background: #f6eace;
}

.body-container .content-message-information {
    background: #eef6fb;
}

.body-container .content-message-error:before {
    color: #fde3de;
}

.body-container .content-message-success:before {
    color: #dde5cf;
}

.body-container .content-message-attention:before {
    color: #e9dcbd;
}

.body-container .content-message-information:before {
    color: #d6e7f1;
}

/**************/
/* list style */
/**************/
ul li::marker {
    color: #3490dc;
}

/******************/
/* Site list: 2er */
/******************/
.namerobot-card-list .card-entry-image img {
    max-width: 100%;
}

/***************/
/* Top Partner */
/***************/
.namerobot-qui-control-siteListPreview-preview-content-social a {
    width: 2rem;
    line-height: 2rem;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    margin-right: 0.5rem;
    font-size: 14px;
}

.namerobot-qui-control-siteListPreview-preview-content-social .facebook-link {
    color: #fff;
    background-color: #3b5998;
}

.namerobot-qui-control-siteListPreview-preview-content-social .twitter-link {
    color: #fff;
    background-color: #1da1f2;
}

.namerobot-qui-control-siteListPreview-preview-content-social .instagram-link {
    color: #fff;
    background-color: #fd1d1d;
}

.namerobot-qui-control-siteListPreview-preview-content-social .linkedin-link {
    color: #fff;
    background-color: #0077b5;
}

.parnter-card-content-link {
    float: right;
}

/*************************************/
/* Brick: recommendation more themes */
/*************************************/
.recommendation-more-themes a {
    width: calc(33% - 2rem);
}

/******************/
/* Partner: Tulex */
/******************/
.partner-tolex-zitat .quiqqer-control-separator__quote {
    border-color: #b21a19;
}

.partner-tulex-color .quiqqer-control-separator__icon .quiqqer-control-separator-icon {
    background: #b21a19;
}

.partner-tulex-3-images .quiqqer-boxContentAdvanced-entry-container:last-child {
    width: 100%;
}

ul.partner-tulex-list .fa {
    color: #b21a19;
}

.partner-tulex-contact .quiqqer-boxContentAdvanced-entries__boxWithShadow .quiqqer-boxContentAdvanced-entry-img .fa {
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
    font-size: 2.5rem;
}

/**********************/
/* Kooperation banner */
/**********************/
.kooperation-banner{
    margin-top: -4rem !important;
    font-weight: normal;
}

.kooperation-banner .quiqqer-control-separator__dark {
    background: linear-gradient(45deg, #3fb2d5, #2e96d2) !important;
}

.kooperation-banner a {
    color: #fff;
    font-weight: bold;
}

.kooperation-banner a:hover,
.kooperation-banner a:focus {
    color: #fff;
}

/************************/
/* Empfehlungen - Liste */
/************************/
@media screen and (min-width: 768px) {
    .page-746 .qui-control-list .flex.flex-wrap,
    .page-634 .qui-control-list .flex.flex-wrap {
        margin-left: -2rem;
        width: calc(100% + 4rem);
    }
}

.page-746 .qui-control-list .card-entry-image img,
.page-634 .qui-control-list .card-entry-image img {
    max-height: initial !important;
    max-width: initial !important;
    object-fit: cover;
}

.sidebar-empfehlungen a {
    color: #fff;
    font-weight: bold;
}

.sidebar-empfehlungen a:hover  {
    color: #fff;
}

/**************/
/* Blog entry */
/**************/
/*.type-quiqqer-blog-blog-entry .page-header,*/
/*.type-quiqqer-blog-blog-entry .page-header-inner {*/
/*    height: 80px !important;*/
/*    min-height: 80px !important;*/
/*}*/

/*.type-quiqqer-blog-blog-entry .page-header-content {*/
/*    display: none !important;*/
/*}*/

.type-quiqqer-blog-blog-entry .breadcrumb {
    padding: 2px 0 !important;
}

.type-quiqqer-blog-blog-entry .quiqqer-breadcrumb-wrapper {
    font-size: 12px;
}

.nr-blogEntry-image {
    max-height: 400px;
    object-fit: cover;
}

/***************/
/* Partner box */
/***************/
.nr-partnerBox {
    --transition: 0.35s ease;
    --bg-image: linear-gradient(to right, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);

    overflow: hidden;
    background-image: var(--bg-image);
    border-radius: calc(1rem + 5px);
    background-size: 200%;
    background-position: 100% 100%;
    transition: var(--transition);
}

.nr-partnerBox-inner {
    position: relative;
    padding: 2rem;
    background-color: #fff;
    margin: 5px;
    border-radius: 1rem;
    padding-right: 200px; /* depend on person image */
}

.nr-partnerBox-inner .btn {
    position: relative;
    z-index: 2;
}

.nr-partnerBox-inner picture,
.nr-partnerBox-inner img {
    position: absolute;
    right: 5px;
    bottom: 0;
    max-height: inherit;
}

.nr-partnerBox-inner picture:after, .nr-partnerBox-inner picture:before {
    content: '';
    position: absolute;
    top: 30%;
    z-index: 0;
    transform: rotate(45deg);
    left: 10%;
    width: 80%;
    aspect-ratio: 1;
    background-image: var(--bg-image);
    transition: var(--transition);
}

.nr-partnerBox-inner picture:before {
    border-radius: 5rem 4rem 3rem 2rem;
    opacity: 0.8;
}

.nr-partnerBox-inner picture:after {
    transform: rotate(25deg);
    border-radius: 2rem;
    opacity: 0.5;
}

.nr-partnerBox-inner img {
    z-index: 1;
    filter: drop-shadow(10px -3px 6px #00000033);
}

/* hover effect */
.nr-partnerBox:hover {
    background-position: 50% 150%;
}

.nr-partnerBox:hover .nr-partnerBox-inner picture:before {
    transform: rotate(55deg) scale(1.2);
}

.nr-partnerBox:hover .nr-partnerBox-inner picture:after {
    transform: rotate(30deg) scale(1.1);
}

@media screen and (max-width: 767px) {
    .nr-partnerBox-inner {
        padding-right: 2rem;
    }

    .nr-partnerBox-inner picture,
    .nr-partnerBox-inner img {
        position: relative;
        display: block;
        margin-bottom: -2rem;
        margin-left: auto;
        margin-right: auto;
        left: initial;
        right: initial;
    }
}