html {
    font-size: 16px;
}

body {
    background-color: #E0E1DD;
    margin: 0;
    font-size: 1rem;
    line-height: 1.4;
}

header, footer {
    font-size: 0.875rem;
}

.button {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
    margin-right: 20px;
    position: fixed;       /* keeps button visible on scroll */
    top: 20px;          /* distance from bottom of viewport */
    right: 20px;           /* distance from right edge */
}

h1 {
    font-family: "komet", sans-serif;
    font-weight: 900;
    font-style: normal;
    margin-left: 25px;
    color: #778DA9;
    font-size: 2.5rem;
}

.profile-pic {
    display: flex;
    justify-content: center; /* centers children horizontally */
    padding: 20px;
}

img {
    width: 15rem;
    height: auto;
}

h2 {
    font-family: "komet-sc", sans-serif;
    font-weight: 500;
    font-style: normal;
    text-align: center;
    color: #415A77;
    font-size: 2.1rem;
    margin-top: 10px;
}

p, ul, ol, li {
    font-size: 1rem;
}

p {
    font-family: "komet", sans-serif;
    font-weight: 300;
    font-style: light;
    text-align: center;
    margin-left: 30px;
    margin-right: 30px;
}

hr {
    height: 5px;
    background-color: black;
    border: 0;
}

.svg-center {
    display: flex;
    justify-content: center; /* horizontal */
    align-items: center;     /* vertical */
    margin-top: 20px;
    margin-bottom: 0px;
}

.location {
    font-family: "komet", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.045rem;
}

.dates {
    font-family: "komet", sans-serif;
    font-weight: 400;
    font-style: light;
    text-align: left;
    font-size: 0.870rem;
    margin-top: 5px;
}

ul {
    margin-left: 10px;
    color: #1B263B;
}

.list-space {
    margin-bottom: 30px;
}

li {
    font-family: "komet", sans-serif;
    font-weight: 300;
    font-style: normal;
    margin-right: 40px;
}

.programs {
    font-family: "komet", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.two-columns {
  columns: 2;          /* Number of columns */
  column-gap: 2rem;    /* Space between columns */
  list-style-position: inside; /* Keeps bullets inside the column */
  padding: 0;
  margin-left: 20px;
  margin-bottom: 30px;
}

.other-links {
    list-style: none;
}

.btn-wrapper-left {
    margin-top: 20px;
    margin-left: 30px;
    margin-bottom: 30px;
}

footer p {
    font-family: "komet", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 0.870rem;
}

/* Disable typography styles*/

.no-typography h1,
.no-typography h2,
.no-typography p,
.no-typography li,
.no-typography .dates,
.no-typography .location,
.no-typography .skills,
.no-typography footer p {
    font-family: initial;
    font-weight: initial;
    font-style: initial;
}

/* Disable all colors */
.no-typography *,
.no-typography {
    color: initial !important;           /* resets text color */
    background-color: initial !important; /* resets background */
    border-color: initial !important;     /* resets border color */
}

/* Disable all image styles */
.no-typography img {
    all: unset;
    display: inline;   /* keep inline display */
    max-width: 100%;   /* optional: keep responsive scaling */
}

/* Disable all SVG alignment and styles */
.no-typography svg {
    all: unset;           /* resets everything */
    display: inline;      /* default display */
    max-width: 100%;      /* optional: keep responsive scaling */
    vertical-align: baseline; /* reset vertical alignment */
}

/* Remove text alignment only */
.no-typography h2,
.no-typography p {
    text-align: initial;
}

/* Disable <hr> styling but keep structure */
.no-typography hr {
    height: initial;
    background-color: transparent;
    border-top: 1px solid currentColor;
}