/* Template specific styles */
@import './font.css';
@import './nav.css';
@import './footer.css';
@import './containers.css';
@import './person-card.css';
/* blocks */
@import './blocks/rds_intro.css';
@import './blocks/rds_kapital.css';
@import './blocks/rds_sound_text.css';
@import './blocks/rds_text.css';
@import './blocks/rds_dummy.css';
@import './blocks/rds_section.css';
@import './blocks/rds_quote.css';
@import './blocks/rds_image.css';
@import './blocks/rds2_header.css';
@import './blocks/rds2_intro.css';
@import './blocks/rds2_capital.css';
@import './blocks/rds2_bg_group.css';
@import './blocks/rds2_bg_text.css';
@import './blocks/rds2_about_image.css';
@import './blocks/rds2_orginal_image.css';
@import './blocks/rds2_dummy.css';
@import './blocks/rds2_zitat.css';
@import './blocks/rds2_normal_group.css';
@import './blocks/rds2_images_text.css';
@import './blocks/rds2_textarea.css';
@import './blocks/rds2_weiterlesen.css';
@import './blocks/rds2_pro_contra.css';
@import './blocks/rds2_map.css';
@import './blocks/rds2_map_detail.css';
@import './blocks/rds2_annotator.css';
@import './blocks/rds2_interview_popup.css';
@import './blocks/rds2_showgraph.css';
@import './blocks/rds2_embed.css';
@import './blocks/rds2_link_card.css';





:root {
    /* media queries */
    /* tablet: 768px */
    /* desktop: 1025px */


    /* font weights */
    --light: 300;
    --regular: 400;
    --medium: 500;
    --bold: 700;
    --black: 900;

    
    /* colors */
    --white-main: #fff;
    --black-main: #000;
    --green-main: #64FF99;

    /* Popup max width */
    --popup-max-width: 1000px;


    /* nav height */
    --nav-height: 60px;
    --nav-height-mobile: 54px;


    /* padding */
    --padding-global: 20px;
    --padding-block-small: 10svh;
    --padding-block-medium: 30svh;
    --padding-block-large: 50svh;


    /* max width */
    --max-width-global: 1920px;
    --max-width-content: 1600px;

    /* border radius */
    --border-radius-global: 20px;
    --border-radius-circle: 50%;
    --border-width-global: 5px;

    /* sound box size */
    --sound-box-size: 90px;

    /* card size */
    --card-max-width: 900px;

}

/* Keyboard tab focus indicator (replaces the browser's default blue outline) */
button:focus-visible,
a:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #66267b;
    outline-offset: 2px;
}

/* Shared background overlay for the detail popup (side drawer) */
.rds2-popup-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 3499;
    cursor: pointer;
}

.rds2-popup-backdrop.is-open {
    display: block;
}

/* hide horizontal scrollbar */
::-webkit-scrollbar {
    display: none;
}
::-moz-scrollbar {
    display: none;
}
::-ms-scrollbar {
    display: none;
}

/* hide vertical scrollbar */
::-webkit-scrollbar {

    display: none;
}
::-moz-scrollbar {
    display: none;
}
::-ms-scrollbar {
    display: none;
}

/* hide scrollbar */
::-webkit-scrollbar {
    display: none;
}
::-moz-scrollbar {
    display: none;
}
::-ms-scrollbar {
    display: none;
}
/* fonts */
@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}



* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
}


body {
    font-family: 'Outfit';
    font-weight: var(--regular);
    color: var(--black-main);
    background-color: var(--black-main);
    overscroll-behavior-y: none;
    font-variant-ligatures: none;
    -webkit-font-feature-settings: "liga" 0, "clig" 0;
    font-feature-settings: "liga" 0, "clig" 0;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}