/*
Theme Name: SwissWPCare Theme
Theme URI: http://swisswpcare.ch
Author: SwissWPCare
Author URI: http://swisswpcare.ch
Description: SwissWPCare Theme
Version: 1.0
Template:seosight
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: seosight
*/

/*****************************************************************
Add Custom styles below 
******************************************************************/

/* TODO:
Fix font loading for the logo to avoid layout shift.
Currently the subtitle width changes shortly after page load,
likely because Nunito font-weight loads later.

Possible fixes:
- Ensure Nunito weights (400, 500, 600) are loaded immediately
- Use proper Google Fonts URL: family=Nunito:wght@400;500;600
- Consider font preloading
- Check if WordPress or theme loads the font multiple times
*/



/*** HEADER LOGO ***/

/* Container (falls dein Theme .logo als flex nutzt) */
.logo {
    display: flex;
    align-items: center;
}

/* Logo Bild */
.logo img {
    display: block;
    max-height: 56px;
    width: auto;
    margin-right: 8px;
}

/* Titel */
.logo-title {
    display: block;              /* sorgt dafür, dass Subtitle darunter kommt */
    font-size: 25px !important;
    font-weight: 500;
    letter-spacing: 0.04em;
    font-family: "Nunito", sans-serif;
    white-space: nowrap;
}

/* Abstand zwischen den Wörtern */
.logo-title span + span {
    margin-left: 3px;
}

/* Subtitle */
.logo-sub-title {
    display: block;              /* zwingt neue Zeile */
    font-size: 9.9px !important;
	font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6E6E73;
	margin-left: 1px;
    margin-top: 4px;
    font-family: "Nunito", sans-serif;
    white-space: nowrap;
}

/* Farben */
.logo-swiss {
    color: #D72427;
}

.logo-wp {
    color: #111111;
}

.logo-care {
    color: #6E6E73;
}

/* Mobile Anpassung */
@media (max-width: 768px) {
    .logo-title {
        font-size: 20px;
    }

    .logo-sub-title {
        font-size: 11px;
    }
}