/* -------------------------------- 

Custom Properties

-------------------------------- */
:root {
/* Font Family */
--font-family-base: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;


/* Font Sizes */
--fs-step-0: clamp(1rem, 0.92rem + 0.39vw, 1.25rem);
--fs-step-1: clamp(1.1875rem, 1.01rem + 0.87vw, 1.75rem);
--fs-step-2: clamp(1.4375rem, 1.11rem + 1.65vw, 2.5rem);
--fs-step-3: clamp(1.75rem, 1.19rem + 2.82vw, 3.5625rem);
--fs-step-4: clamp(2.0625rem, 1.15rem + 4.56vw, 5rem);
--fs-step-5: clamp(2.5rem, 1.08rem + 7.09vw, 7.0625rem);
--fs-step-6: clamp(3rem, 0.84rem + 10.78vw, 9.9375rem);
--fs-base: 1rem;
--fs-small: .8rem;

/* Font Tracking */
--tracking-loose: -0.02ch;
--tracking-mid: -0.05ch;
--tracking-tight: -0.075ch;
--tracking-normal: normal;
--tracking-extra: 0.05ch;

/* Container */
--max-width: 1280px;
--full-width: 100%;
--full-height: 100%;

/* Margin Center */
--margin-0auto: 0 auto;

/* Padding */
--padding-01: 0 1rem;
--padding-10: 1rem 0;
--padding-12: 1rem 2rem;
--padding-1: 1rem;
--padding-2: 2rem;
--padding-02: 0 2rem;
--padding-20: 2rem 0;
--padding-32: 3rem 2rem;
--padding-4: 4rem;
--padding-40: 4rem 0;
--padding-04: 0 4rem;
--padding-41: 4rem 1rem;
--padding-42: 4rem 2rem;
--padding-0121: 0 1rem 2rem 1rem;
--padding-3202: 3rem 2rem 0 2rem;
--padding-4202: 4rem 2rem 0 2rem;
--padding-4000: 4rem 0 0 0;

/* Transitions */
--transition-long: 650ms ease-in-out;
--transition-base: 500ms ease-in-out;
--transition-medium: 250ms ease-in-out;
--transition-fast: 100ms ease-in-out;
}

/* -------------------------------- 

Main Setup

-------------------------------- */
*, *:after, *:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

html {
scroll-behavior: smooth;
}


body {
font-family: var(--font-family-base);
font-size: var(--fs-step-0);
background-color: #edf5f7;
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
}

h1 {
letter-spacing: var(--tracking-tight);
line-height: var(--line-height-1);
margin: var(--margin-0);
padding: var(--padding-0);
}



/* -------------------------------- 

Logo

-------------------------------- */
.logo-container {
max-width: 500px;
margin: 0;
padding: 0;
margin: 0 auto;
}

.logo {
display: block;
max-width: 550px;
margin: 0;
padding: 0;
}

@media (max-width: 949px) {
.logo {
max-width: 350px;
}
}


/* -------------------------------- 

Grid Setup

-------------------------------- */

/* section {
margin-top: 20%;
} */

.offline {
margin-top: 10rem;
max-width: var(--full-width);
display: grid;
grid-template-columns: 1fr;
}

.offline-inner  {
display: grid;
grid-template-columns: 1fr;
max-width: 1280px;
margin: 0 auto;
}



.offline h1 {
color: #49758c;
letter-spacing: var(--tracking-normal);
font-weight: normal; 
margin: 1.5rem 0;
text-align: center;
}

@media only screen and (max-width: 767px) {
    .offline {
        margin-top: 5rem;
        transition: var(--transition-medium);
        }
}