/* ===============================
   Author: {Marina}
   Date:   {August 2026}
   
   Notes:
   Hand coded for Build a Website
   from Scratch with HTML & CSS
   by Marina VFX
   
   Colour Palette:
   ---------------
   Void:		         #070912
   Deep Space:			#11172A
   Field Blue:			#19243D
   Starlight:			#F1EEE5
   Cosmic Dust:      #9299AA
   Marina Gold:      #E3CB73
   Stellar Gold:     #F1DFA0
   Quantum Violet:   #685B88
   =============================== */
/* Fonts */
@font-face {
  font-family: 'Cormorant';
  src: url('../fonts/CormorantGaramond-VariableFont_wght.ttf') format('truetype');
}
@font-face {
  font-family: 'PlexMono';
  src: url('../fonts/IBMPlexMono-ExtraLight.ttf') format('truetype');
}
@font-face {
  font-family: 'Manrope';
  src: url('../fonts/Manrope-VariableFont_wght.ttf') format('truetype');
}
/* General */
*{
   margin: 0;
   padding: 0;
   text-align: center;
   position: relative;
   list-style: none;
}
html {
   scroll-behavior: smooth;
}
#about {
   color: #E3CB73;
}

/* Hero */
.resume_hero{
   width: 1200px;
   height: 600px;
   margin: 0 auto;
   background: url(../images/resume/resume_hero_bg.jpg) top center no-repeat;
   position: relative;
}
.resume_hero_intro{
   position: absolute;

   left: 70px;
   top: 85px;

   text-align: left;
}
.resume_hero_intro h1{
   margin: 0 0 22px 0;

   font-family: 'Cormorant', serif;
   font-size: 62px;
   font-weight: 500;
   line-height: 0.95;
   letter-spacing: 0.04em;
   text-transform: uppercase;

   color: #F1EEE5;
   text-align: left;
}
.resume_hero_intro > p{
   width: 450px;

   margin: 0;

   font-family: 'Manrope', sans-serif;
   font-size: 14px;
   font-weight: 400;
   line-height: 1.7;

   color: rgba(241, 238, 229, 0.72);

   text-align: left;
}

.resume_hero_contacts{
   position: absolute;

   left: 70px;
   top: 425px;

   text-align: left;
} 
.resume_hero_contacts_primary{
   display: flex;
   align-items: center;
   gap: 28px;

   list-style: none;
   margin: 0 0 14px 0;
   padding: 0;
}
.resume_hero_contacts_social{
   display: flex;
   align-items: center;
   gap: 22px;

   list-style: none;
   margin: 25px 0 0 0;
   padding: 0;
}
.resume_hero_contacts li, .resume_hero_contacts li a{
   display: flex;
   align-items: center;
   gap: 8px;
}
.resume_hero_contacts, .resume_hero_contacts a{
   font-family: 'Manrope', sans-serif;
   font-size: 13px;
   font-weight: 400;
   line-height: 1.2;
   letter-spacing: 0.02em;
   text-decoration: none;
   color: #9299AA;
}
.resume_hero_contacts a:hover{
   color: #F1DFA0;
}
.resume_hero_contacts_social a{
   font-size: 13px;
   font-weight: 500;
   letter-spacing: 0.04em;
}

.resume_hero_actions{
   display: flex;
   align-items: center;
   gap: 16px;

   
   position: absolute;
   left: 70px;
   bottom: 55px;
}
.resume_hero_button{
   display: inline-flex;
   align-items: center;
   justify-content: center;

   width: 150px;
   min-height: 44px;
   padding: 0 22px;
   

   font-family: 'Manrope', sans-serif;
   font-size: 11px;
   font-weight: 600;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   text-decoration: none;

   transition: 0.25s ease;
}
.resume_hero a.resume_hero_button_view{
   color: #E3CB73;
}
.resume_hero a.resume_hero_button_view:hover{
   color: #F1DFA0;
   border-color: #F1DFA0;
}
.resume_hero a.resume_hero_button_download{
   color:#070912;
}
.resume_hero a.resume_hero_button_download:hover{
   background:#F1DFA0;
   border-color: #F1DFA0;
}
.resume_hero_button_view{
   color: #E3CB73;

   background: transparent;
   border: 1px solid rgba(227, 203, 115, 0.45);
}
.resume_hero_button_download{
   color: #070912;

   background: #E3CB73;
   border: 1px solid #E3CB73;
}

/* Resume Content */
.resume_content{
   width: 1200px;
   margin: 0 auto;

   display: grid;
   grid-template-columns: 1.65fr 0.85fr;
   gap: 28px;

   padding: 10px 50px;
   
   box-sizing: border-box;
}
.resume_experience, .resume_skills_tools{
   border: 1px solid rgba(227, 203, 115, 0.28);
   background: rgba(17, 23, 42, 0.4);

  box-sizing: border-box;
}

.resume_skills_tools > h2{
   margin: 0;
   padding: 30px 28px 22px;
}



/* Resume Experience */
.resume_experience{
   position: relative;

   min-height: 650px;
   padding: 36px 38px;

   box-sizing: border-box;

   border: 1px solid rgba(227, 203, 115, 0.28);
   background: rgba(17, 23, 42, 0.4);
}
.resume_section_heading{
   display: flex;
   align-items: center;
   gap: 10px;

   margin: 0 0 34px;

   font-family: 'Cormorant', serif;
   font-size: 34px;
   font-weight: 500;
   line-height: 1;
   letter-spacing: 0.06em;

   text-transform: uppercase;

   color: #E3CB73;

   text-align: left;
}
.resume_section_star{
   width: 32px;
   height: 32px;
   filter: drop-shadow(0 0 6px rgba(227, 203, 115, 0.35));

   display: block;
   flex-shrink: 0;
}
.resume_experience_content{
   max-height: 530px;

   overflow-y: auto;
   overflow-x: hidden;

   padding-right: 16px;
}
.resume_timeline_item{
   position: relative;

   display: grid;
   grid-template-columns: 105px 1fr;
   column-gap: 36px;

   padding-bottom: 46px;
}
.resume_timeline_date{
   padding-top: 3px;

   font-family: 'PlexMono', monospace;
   font-size: 10px;
   font-weight: 400;
   line-height: 1.5;
   letter-spacing: 0.05em;

   text-transform: uppercase;
   text-align: right;

   color: #9299AA;
}
.resume_timeline_item::before{
   content: "";

   position: absolute;

   left: 122px;
   top: 10px;
   bottom: -4px;

   width: 1px;

   background: rgba(227, 203, 115, 0.3);
}
.resume_timeline_text{
   position: relative;
}
.resume_timeline_text::before{
   content: "";

   position: absolute;

   left: -23px;
   top: 5px;

   width: 8px;
   height: 8px;

   border-radius: 50%;

   background: #E3CB73;

   box-shadow: 0 0 6px rgba(227, 203, 115, 0.75), 0 0 12px rgba(227, 203, 115, 0.25);
}
.resume_timeline_text h3{
   margin: 0 0 5px;

   font-family: 'Cormorant', serif;
   font-size: 22px;
   font-weight: 500;
   line-height: 1.1;

   color: #F1EEE5;
   text-align: left;
}
.resume_timeline_text h4{
   margin: 0 0 14px;

   font-family: 'Manrope', sans-serif;
   font-size: 11px;
   font-weight: 600;
   line-height: 1.2;

   letter-spacing: 0.1em;
   text-transform: uppercase;

   color: #E3CB73;
   text-align: left;
}
.resume_timeline_text ul{
   margin: 0;
   padding: 0;

   list-style: none;
}
.resume_timeline_text li{
   position: relative;

   margin-bottom: 7px;
   padding-left: 14px;

   font-family: 'Manrope', sans-serif;
   font-size: 13px;
   font-weight: 400;
   line-height: 1.6;

   color: rgba(241, 238, 229, 0.7);
   text-align: left;
}
.resume_timeline_text li::before{
   content: "";

   position: absolute;

   left: 0;
   top: 0.65em;

   width: 3px;
   height: 3px;

   border-radius: 50%;

   background: #E3CB73;
}
.resume_timeline_item:last-child::before{
   bottom: calc(100% - 12px);
}

/* Skills & Tools */
.resume_skills_tools{
   min-height: 650px;

   box-sizing: border-box;

   display: flex;
   flex-direction: column;
}
.resume_skills_block, .resume_tools_block, .resume_languages_block{
   padding: 26px 28px;
}
.resume_tools_block, .resume_languages_block{
   border-top: 1px solid rgba(227, 203, 115, 0.22);
}
.resume_skills_tools h3{
   margin: 0 0 14px;

   font-family: 'Manrope', sans-serif;
   font-size: 11px;
   font-weight: 600;
   line-height: 1.2;

   letter-spacing: 0.18em;
   text-transform: uppercase;

   color: #E3CB73;
   text-align: left;
}
.resume_software_list{
   display: flex;
   flex-wrap: wrap;

   gap: 22px 18px;

   list-style: none;
   margin: 0;
   padding: 0;
}
.resume_software_list li{
   width: 88px;

   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
   text-align: center;

   font-family: 'Manrope', sans-serif;
   font-size: 13px;
   font-weight: 400;
   line-height: 1.7;

   color: rgba(241, 238, 229, 0.72);
}
.resume_software_list img{
   width: 22px;
   height: 22px;

   display: block;
   margin-bottom: 10px;
}
.resume_skills_tools p{
   margin: 0;

   font-family: 'Manrope', sans-serif;
   font-size: 13px;
   font-weight: 400;
   line-height: 1.7;

   color: rgba(241, 238, 229, 0.72);
   text-align: left;
}
.resume_languages_block p{
   margin-bottom: 6px;
   padding: 0 0 0 20px;
}
.resume_languages_block p:last-child{
   margin-bottom: 0;
}
.resume_languages_content{
   display: flex;
   align-items: center;
   gap: 12px;
}
.resume_languages_icon{
   width: 32px;
   height: 32px;

   display: block;
   flex-shrink: 0;
}

/* Education */
.resume_background_section{
   width: 1200px;
   margin: 0 auto;

   display: grid;
   grid-template-columns: 1.65fr 0.85fr;
   gap: 28px;

   padding: 0 50px;
   box-sizing: border-box;
}
.resume_education, .resume_background{
   min-height: 520px;

   box-sizing: border-box;

   border: 1px solid rgba(227, 203, 115, 0.28);
   background: rgba(17, 23, 42, 0.35);
}
.resume_education{
   padding-left: 20px;
}
.resume_education_content{
   padding-left: 12px;
}
.resume_education > h2, .resume_background > h2{
   margin: 0;
   padding: 30px 28px 22px;
}
.resume_education_content{
   max-height: 530px;

   overflow-y: auto;
   overflow-x: hidden;

   padding-right: 16px;
}
.resume_education_item{
   position: relative;

   display: grid;
   grid-template-columns: 110px 1fr;
   column-gap: 36px;

   padding-bottom: 30px;
}
.resume_education_date{
   padding-top: 3px;

   font-family: 'PlexMono', monospace;
   font-size: 10px;
   font-weight: 400;
   line-height: 1.5;

   letter-spacing: 0.04em;
   text-transform: uppercase;
   text-align: right;

   color: #9299AA;
}
.resume_education_item::before{
   content: "";

   position: absolute;

   left: 127px;
   top: 9px;
   bottom: -2px;

   width: 1px;

   background: rgba(227, 203, 115, 0.3);
}
.resume_education_text{
   position: relative;
}
.resume_education_text::before{
   content: "";

   position: absolute;

   left: -23px;
   top: 5px;

   width: 8px;
   height: 8px;

   border-radius: 50%;

   background: #E3CB73;

   box-shadow: 0 0 6px rgba(227, 203, 115, 0.75), 0 0 12px rgba(227, 203, 115, 0.25);
}
.resume_education_text h3{
   margin: 0 0 5px;
   
   font-family: 'Cormorant', serif;
   font-size: 20px;
   font-weight: 500;
   line-height: 1.15;

   color: #F1EEE5;
   text-align: left;
}
.resume_education_text p{
   margin: 0;

   font-family: 'Manrope', sans-serif;
   font-size: 12px;
   font-weight: 400;
   line-height: 1.5;

   color: rgba(241, 238, 229, 0.7);
   text-align: left;
}
.resume_education_item:last-child{
   padding-bottom: 0;
}
.resume_education_item:last-child::before{
   display: none;
}
/* Background */
.resume_background_content{
   padding: 36px 38px;
}
.resume_background_content p {
   margin: 0 0 22px;

   font-family: "Manrope", sans-serif;
   font-size: 14px;
   font-weight: 400;
   line-height: 1.75;

   color: rgba(241, 238, 229, 0.72);
}
.resume_background_content p:last-child{
   margin-bottom: 0;
}