/*
================================================

Space Vanta Theme 1.0

Module:
Header

File:
public/header/wordmark.css

Component:
Wordmark

Version:
HV-003 v2

Design Direction:
Spatial Fragmentation
Geometric Editorial
Accessible Premium

Responsibilities:
- Wordmark typography
- SPACE spatial language
- S / V hierarchy
- E disappearance treatment
- Desktop / Mobile scaling

Does NOT control:
- Header layout
- Logo
- Header icons
- Navigation

================================================
*/


/* =================================================
   WORDMARK CONTAINER
   ================================================= */

.sv-header__wordmark {

    display: flex;

    align-items: center;

    justify-content: center;

}


/* =================================================
   WORDMARK LINK
   ================================================= */

.sv-wordmark {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    color: #1E232B;

    text-decoration: none;

}


/* =================================================
   WORDMARK TEXT
   ================================================= */

.sv-wordmark__text {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    font-family:
        "Avenir Next",
        "Futura",
        "Century Gothic",
        "Helvetica Neue",
        Arial,
        sans-serif;

    font-size: 28px;

    line-height: 1;

    font-weight: 500;

    white-space: nowrap;

}


/* =================================================
   WORDMARK CHARACTERS
   ================================================= */

.sv-wordmark__char {

    position: relative;

    display: inline-block;

    flex: 0 0 auto;

    color: #1E232B;

}


/* =================================================
   SPACE
   Spatial / expansive language
   ================================================= */

.sv-wordmark__space {

    display: inline-flex;

    align-items: center;

}


/* -------------------------------------------------
   SPACE — Internal Spatial Rhythm
   ------------------------------------------------- */

.sv-wordmark__space .sv-wordmark__char+.sv-wordmark__char {

    margin-left: .31em;

}


.sv-wordmark__space .sv-wordmark__char:nth-child(3) {

    margin-left: .35em;

}


.sv-wordmark__space .sv-wordmark__char:nth-child(4) {

    margin-left: .31em;

}


/* =================================================
   SPACE — S
   Primary geometric emphasis

   S is intentionally stronger than V.
   It references the primary geometric S
   within the Space Vanta logo.
   ================================================= */

.sv-wordmark__char--s {

    font-size: 1.20em;

    font-weight: 600;

    letter-spacing: -.035em;

    transform: translateY(-.015em);

}


/* =================================================
   SPACE — E
   Spatial disappearance

   The E remains readable while its left
   vertical structure subtly disappears
   into the surrounding space.
   ================================================= */

.sv-wordmark__char--e {

    margin-left: .36em;

    text-shadow:
        0 0 5px rgba(30, 35, 43, .08);

}


/* -------------------------------------------------
   E — disappearing vertical
   ------------------------------------------------- */

.sv-wordmark__char--e::after {

    content: "";

    position: absolute;

    left: -.015em;

    top: .08em;

    width: .045em;

    height: .84em;

    background: var(--sv-bg);

    box-shadow:
        2px 0 4px rgba(30, 35, 43, .12);

    pointer-events: none;

}


/* =================================================
   SPACE / VANTA GAP
   Intentional dimensional space
   ================================================= */

.sv-wordmark__word-gap {

    display: block;

    width: 1.55em;

    flex: 0 0 1.55em;

}


/* =================================================
   VANTA
   Stable / refined language
   ================================================= */

.sv-wordmark__vanta {

    display: inline-flex;

    align-items: center;

}


/* -------------------------------------------------
   VANTA — Internal Rhythm
   ------------------------------------------------- */

.sv-wordmark__vanta .sv-wordmark__char+.sv-wordmark__char {

    margin-left: .20em;

}


/* =================================================
   VANTA — V
   Secondary geometric emphasis

   V references the secondary geometric
   V element in the Space Vanta logo.

   S intentionally remains stronger than V.
   ================================================= */

.sv-wordmark__char--v {

    font-size: 1.10em;

    font-weight: 550;

    letter-spacing: -.025em;

    transform: translateY(-.01em);

}


/* =================================================
   MOBILE
   ================================================= */

@media(max-width:767px) {


    /* ---------------------------------------------
     Base Wordmark
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__text {

        font-size: 18px;

        font-weight: 500;

    }


    /* ---------------------------------------------
     SPACE
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__space .sv-wordmark__char+.sv-wordmark__char {

        margin-left: .22em;

    }


    .sv-header__mobile .sv-wordmark__space .sv-wordmark__char:nth-child(3) {

        margin-left: .25em;

    }


    .sv-header__mobile .sv-wordmark__space .sv-wordmark__char:nth-child(4) {

        margin-left: .22em;

    }


    /* ---------------------------------------------
     S
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__char--s {

        font-size: 1.14em;

    }


    /* ---------------------------------------------
     E
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__char--e {

        margin-left: .25em;

    }


    /* ---------------------------------------------
     SPACE / VANTA GAP
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__word-gap {

        width: 1.20em;

        flex-basis: 1.20em;

    }


    /* ---------------------------------------------
     VANTA
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__vanta .sv-wordmark__char+.sv-wordmark__char {

        margin-left: .15em;

    }


    /* ---------------------------------------------
     V
     --------------------------------------------- */

    .sv-header__mobile .sv-wordmark__char--v {

        font-size: 1.08em;

    }

}